Using CSS Sprites to Create Easy Image Rollovers: A Tutorial
By Jeremy Lindblom on June 2nd, 2008
In this tutorial, I’ll show you how to quickly and easily use single images and a bit of crafty CSS to create easy image rollovers. You can also use this technique to simplify browser caching of your images by storing multiple images in a single “meta image”, so to speak. (There are some reasons not to do this, though.)
I don’t know if the creators of CSS were thinking of sprites (more on that later) when they thought of the background-position property [Never doubt the range of "what if" thoughts of those who created CSS—Ed] but thanks to many innovative CSS users, we have an excellent way to reduce the load times of our pages. Check it out, after the break.
Tagged with: background-image, button rollovers, css, javascript, load time, optimization, sprites



