Bij het hoveren over de links, in bijvoorbeeld een navigatie, kun je het visuele effect toevoegen dat er een pijl je muisaanwijzer volgt om aan te geven dat je over de specifieke link aan het hoveren bent. Dit kan eenvoudiger met Javascript gedaan worden, maar een pure CSS oplossing is toch weer dat beetje leuker.
Herinner je je de tijd dat animated gif’s cool waren, overal (soms in overuse) gebruikt werden en het niemand scheelde dat bandbreedte een issue was? Natuurlijk kan je Jquery gebruiken, maar laten we eens terug gaan in de tijd een een good old fashion animated gif gebruiken om een menu te animeren:
Eerst plaats je de stylesheet voor de moderne browsers, zoals FireFox, Opera, Safari etc…, daarna pas de aangepaste stylesheet voor Internet Explorer versie allemaal.
Als je toelaat om je website af te printen door middel van een bijvoorbeeld print.css, is het misschien handig dat links in je document niet verloren gaan, maar dat bij het printen de gehele URL die achter de link zit ook afgeprint wordt.
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.