tomcat-users mailing list archives

Site index · List index
Message view « Date » · « Thread »
Top « Date » · « Thread »
From Nikola Milutinovic <>
Subject Re: Reducing network traffic for rollover images
Date Mon, 04 Oct 2004 05:36:43 GMT
Robert Hunt wrote:
> After some analysis and trial & error, I've found** that the correct JS 
> syntax in this application is:
>        {HTMLElement}.style.backgroundImage  =  'url( ' + img1.src + ')';
> where {HTMLElement} would be "this" as in:
>        <a href="xxx" onmouseover=" = 'url(' + 
> img1.src + ')';" ...>

Why are you using background? Why not a regular image?

<a href="..." onMouseOver="img1.src = 'img1_over.gif'" 
onMouseOut="img1.src = 'img1.gif'">
	<img name="img1" id="img1" src="img1.gif">

Or you can use DOM style: onMouseOver="document.getEllementByID( "img1" 
).src = 'img1_over.gif'"

> Watching the Tomcat access log and using permutations of CSS and the 
> FrankZ/jscript-caching-strategy to achieve the rollover effects, I've 
> found that the background image is requested:
>                IExplore 6.0            Netscape 7.2
> CSS        each mouseover       once per page
> JS           each mouseover       once per page

Try the real image, that is pre-fetched in a script.

> So, as has been 99% of my experience, NS does it right, IE leaves a bit 
> to be desired.  <heavy sigh>  It appears that when 
> ".style.backgroundImage" is modified in IE, another HTTP GET request is 
> triggered.  I'm going to see if I can do a "swap" with a hidden element 
> that (already) has the desired style and see if I can fake out IE.

I understand what you want to do. You want your rollover to be done in 
CSS, no JScript or JavaScript involved. I'm afraid ther is no ellegant 
way of doing it. Using the background is awkward. That <a> ellement has 
to wrap something other than thin air. So you'll be placing a 
transparent GIF or something else traslucent inside the tag.

No, image rollovers work best the traditional way.


To unsubscribe, e-mail:
For additional commands, e-mail:

View raw message