CSS Sprites2
CSS Sprites have been a staple of modern web development since Dave Shea formally introduced the technique in his A List Apart article from 2004. The concept is simple: if you want the appearance of a link to change when hovered, you put the normal and hover state in the same background image and offset the background-position with CSS when the link is hovered. The benefit was that you no longer had to save the hovered version of the link as a separate image and more importantly, didn’t have to rely on JavaScript. …and nobody ever really missed MM_preloadImages(), MM_swapImage(), and MM_swapImgRestore().
Well, Shea is bringing JavaScript back with an updated version of his technique which is aptly named CSS Sprites 2. The original functionality is maintained for users without JavaScript, but transitional effects are dynamically added to the rollover using jQuery.
Comments
Looks pretty cool Joel. Jonathan Snook also posted today about how to achieve a similar effect with the background-position plugin: Using jQuery for Background Image Animations
I just redid the script as a cleaner jQuery plugin. The writeup is here:
http://www.newmediacampaigns.com/page/css-sprites...