Image rollovers

The over (on) state of the image is placed in the background of the list and the normal state (off) is placed in the background of the anchor. This ensures that both images are loaded at run-time and are cached ready for use.

On hover the background of the anchor is made transparent and the image underneath shows through. This means there is no delay. As a general rule you should never swap an image on hover as the image doesn't get loaded until the first hover takes place and a delay is observed.