Preloaden von background-images bei a:hover

[Christian S.]

Hi,

ich habe folgendes Problem:

Ich habe mittels der a:hover Eigenschaft Links erstellt, die einen Background haben.

Es sieht also etwa so aus:

a:link
{
   background-image: url(image.jpg);
}

a:hover
{
   background-image: url(image_hover.jpg);
}

Weitere Eigenschaften wie width und height sind auch noch drin, sollen aber hier nicht berücksichtigt werden.

Das Problem ist nun, dass beim (erstmaligen) Laden der Seite, die Images des a:hover noch nicht geladen sind, und erst beim Hover geladen werden. Das gibt einen etwas unschönen Effekt, da während der Ladezeit, der Link leer ist (weiß ist oder flackert).

Bei JavaScript Hover-Buttons gibts das Problem ja auch, aber dort kann ich die Hover-Bilder ja "preloaden".

Wie mache ich das nun auch mit CSS, dass auch die Hover-Bilder schon direkt beim Laden der Seite mitgeladen werden, und nicht erst beim Hover?

Danke und Gruß
Christian