Hi
This isn't specifically a roll-over related question exclusively. More and more when I 'Inspect element' on a roll-over link in Chrome, which clearly has two images, i see that it is infact 1 image, and the two images are stacked...
How does this work? how is only one half shown, and then the other when the roll-over is initiated?
thanks
lworks
It sounds like you are describing a "sprite".
Sprites are well explained on the web, so I won't try to add anything here.
Try googling "sprite javascript css".
Airshow
Thanks, I think Ive seen the word sprite around, ill check it out!
if you look at the speed report for any site, I use one at http://websiteoptimization.com/services/analyze/ , you can see why sprites are pouplar
in the table that shows overheads
icon might be 100bytes,
but there is ~220bytes in the http to download it, more overhead than content
sprite with 2 states, breaks even,
sprite with three states, more content, less overhead
Hi Bob. Good point.
I was looking at a jquery plugin recently that had some 12-15 little image components in one sprite. Neat!
Airshow
We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.