WebObjects® Developer's Guide

Optimizing Components Using Nonsynchronized Variables

Our next task is to add rollovers to the image map. That is when a link becomes highlighted when the mouse rolls over it. We'll prototype the component using image preloading right from the start. Otherwise, you can't expect the rollovers to be smooth for larger images.

Hence, we'd produce a DHTML along the lines of

<script language=JavaScript>
        image_U = new Image();
        image_U.src = '/image.gif';
        image_H1 = new Image();
					image_H1.src = '/imageH1.gif';
					image_H2 = new Image();
					image_H2.src = '/imageH2.gif';
</script>
<Map Name="splashmap" onMouseOut="image.src=image_U.src">
        <Area Shape=Rect Coords="191,137,259,174" Href="/page1.html"
        onMouseOver="image.src=image_H1.src"> <Area Shape=Rect Coords="191,137,259,174" ...