bildwechsel mit :hover

[qwd]

Hi Leute!
Ich will folgendes machen

ich habe einen div bereich und der hat als hitnergrund img1.gif
dann will ich per css veranlassen das bei :hover img2.gif sichtbar wird.

wie geht das?

[Gernot Back]

Hallo qwd,

ich habe einen div bereich und der hat als hitnergrund img1.gif
dann will ich per css veranlassen das bei :hover img2.gif sichtbar wird.

wie geht das?

Das ist in Browsern kein Problem:

  
div#deinDiv:hover {  
   background-image:url(img2.gif);  
}

Solltest du den Bildwechsel auch im Internet-Explorer haben wollen, musst du statt des DIV ein A-Element nehmen, und diesem ggf. die Eigenschaft display:block sowie cursor:default verpassen, damit die Nutzer nicht unnötigerweise darauf klicken, weil sie tatsächlich einen Link vermuten.

Gruß Gernot

[Ashura]

Hallo Gernot.

Solltest du den Bildwechsel auch im Internet-Explorer haben wollen, musst du statt des DIV ein A-Element nehmen, und diesem ggf. die Eigenschaft display:block sowie cursor:default verpassen, damit die Nutzer nicht unnötigerweise darauf klicken, weil sie tatsächlich einen Link vermuten.

Wobei es mir das nicht wert wäre.
Da es sich hier alleinig um einen gestalterischen Effekt handelt, ist der Missbrauch des a-Elementes meiner Auffassung nach nicht gerechtfertigt.

Einen schönen Donnerstag noch.

Gruß, Ashura

[Ashura]

Hallo qwd.

ich habe einen div bereich und der hat als hitnergrund img1.gif
dann will ich per css veranlassen das bei :hover img2.gif sichtbar wird.

wie geht das?

Exakt so, wie du es selbst schon beschreibst; du verpasst dem jeweiligen Element „img1.gif“ als http://de.selfhtml.org/css/eigenschaften/hintergrund.htm#background@title=Hintergrund und wechselst diesen bei http://de.selfhtml.org/css/eigenschaften/pseudoformate.htm#link_visited_focus_hover_active@title=:hover zu „img2.gif“.

Wo liegt das Problem?

Einen schönen Donnerstag noch.

Gruß, Ashura