Of je nu CSS of Javascript gebruikt, een achtergrondafbeelding bij een link zal meestal dan pas geladen worden als ze nodig is , bij het hoveren en dit kan soms een vertraging opleveren, en JavaScript preloaden is tegenwoordig geen optie meer.
De oplossing is één afbeelding te gebruiken die alle “states” reeds bevat, en bij hover verander je de afbeelding van plaats, dus geen vertraging meer.

HTML

<div id="menu">
 <a href="#" title="link">link</a>
</div>

CSS

#menu a:link, #menu a:visited {
background: url(images/mhu.gif) 0 0 no-repeat;
text-indent: -9000px;
display: block;
height: 110px;
width: 97px;
}
#menu a:hover, #menu a:active {
background-position: 0 -110px;
}