Nice CSS Menu Item Trick

0 minute read

I ran across an interesting post from Petr Stanicek at called Fast Rollovers Without Preload.  The site itself is interesting, as it is a blog that is written and displayed in both English and Czech.  Nice trick in itself.

The CSS trick allows you to use a single image to contain all of the behaviors for menu items.  You then use CSS to “move” the image to display the “right” part of it based on the behavior (hover, active, etc.).  Be sure to read the Update to see how to avoid some flickering behavior in IE.  This looks like it might work well in SharePoint, as the trick works with background images, which SharePoint is already using.  I’m going to try it the next time it makes sense to do so.


Have a thought or opinion?