Felix Riesterer: Icon wechseln bei Hover

Beitrag lesen

Liebe Steffi_,

Du willst, dass beim Hovern eines bestimmten Kindelementes sich das Elternelement visuell verändert. Das geht meines Wissens nicht mit CSS alleine, sondern benötigt JavaScript.

Mit CSS alleine kannst Du nur "faken". Das soll heißen, dass Du mit z.B. absoluter Positionierung einen "generierten Inhalt" über das Hintergrundbild des Elternelements legst, damit es so aussieht, als ob sich das Elternelement verändert hätte. In diesem Fall hat es einen Sinn, für das Elternelement position:relative einzustellen, damit sich die Koordinaten für den generierten Inhalt an den Begrenzungen des Elternelements orientieren, und nicht an <body>.

Mit JavaScript könntest Du den Klassennamen des Elternelements ergänzen, sodass aus "settings" vielleicht "settings account" wird, worauf du mit einem passenden Selektor in CSS wieder reagieren und ein anderes Hintergrundbild verwenden lassen kannst. Aber ich weiß jetzt nicht, ob Du JavaScript verwenden willst, und ob Du vielleicht sogar ein Framework wie jQuery einsetzt, sodass ich Dir noch kein Code-Beispiel dafür geben kann.

Liebe Grüße,

Felix Riesterer.