bilder austauschen über css

[Dust]

Es ist möglich mit css ein hintergrundblid auszuwechseln.

Jeder kennt die mousover efekte welche dafür sorge tragen das Bilder ausgetauscht werden. (ich denke farben kennt jeder)
im grunde geht es wie bei den farben mit dem :hover eigenschaft.

/* fast die class blub und blub hover zusammen  */
.blub, .blub:hover{
    width:100px;
    height:25px;
    background-repeat:repeat-x;
    display:block;
}

/* das Bild das ausgetauscht werden soll */
.blub{
    background-image:url(/pfad/zum/bild1gif);
}

/* das Bild was eingetauscht wird */
.blub:hover{
    background-image:url(/pfad/zum/bild2.gif);
}

<!-- Einfacher Link mit der css class blub -->
<a href="#" class="blub"></a> 

Ich mache hier nichts anderes als der class eine höhe und breite zu geben.
display block ist dafür zuständig das das a element den gesammten "raum" ausfüllt (in dem falle also 100x25 px) das background-repeat bezieht sich auf das bild das es nur horizontal wiederholt wird (es geht auch repeat-y (demnach vertikal))
wenn man es nicht angibt wird es wie ein sich wiederholendes bild angezeigt.
das hover übernimmt jetzt nun das javascript welches bilder zwei bilder ausgetauscht hat.

Mag sein das es nicht allzu schön und w3c konform ist, aber es zumindestens eine möglichkeit bilder ohne javascript auszutauschen.

[HoRnominatoR]

ja, und?

[Dust]

hmmm und ich dachte das wüssten nicht so viele ... *schnüf*

ähm aber das klappt auch im ie *hoffnungsvoll aufblick*

[HoRnominatoR]

kannst ruhig dazuschreiben, wenn es ein rein informativer beitrag sein soll

das problem ist aber der unnoetige link.

[Dust]

naja ich persöhnlich nutze die hoverefekte bei einem Menue, und für bilder musste ich halt wohl oder überl mit javascript arbeiten.

wenn ich ein anderes element nehmen würde, würde das nur noch in der gecko engin klappen und nicht mehr im ie.

Wo brauchst du den noch hover efekte?

[HoRnominatoR]

ich? ich brauch das garnicht. nebenher gibts auch noch die opera-engine, khtml und sicher noch anderen - aber der IE kanns nicht, das stimmt wohl. irgendwo im HTML oder PHP forum (traumscripte?) gibts es auch ein menu das mit :hover auf blockelemente arbeitet und als kruecke fuer den IE JS verwendet.

es ist bloss nicht immer die semantischste/gueltigste loesung ein <a> zu benutzen.