Bei hover anderes Element ändern

[burn4ever]

Hallo,
ich habe ein Bild un darunter ein h1 Element.
Ich möchte nun bei dem hover des Bildes ( img:hover{} ) die Farbe der überschrift (h1) ändern.

Kann jemand helfen?

 

[Space Vampire]

Setze das Bild mit in den H1-tag und gib diesem die Hover-Attribute.

h1{
   color: green;
}
h1:hover{
   color: red;
}

<h1>
   <img src="bild.jpg" alt="ein Bild">
   <br>
   Eine Überschrift
</h1>

 

[Tronjer]

Wäre eine Möglichkeit. Allerdings gehört ein Image nicht in ein <h1> Tag.

Ein kleines jQuery-Script tut es auch. Dabei können die Elemente in unterschiedlichen Containern stehen.

$("#imageId").hover(
    function() {$("h1").css("color", "red")},
    function() {$("h1").css("color", "black")}
);

 

[bodil]

Die Lösung gefällt mir. Die Begründung erstaunt mich aber. Warum darf ein Bild nicht in eine Überschrift? Was m.E. gegen diese Idee spricht, ist dass ich gerade bei älteren IEs nicht damit rechnen würde, dass die Pseudoklasse h1:hover irgendeine Auswirkung hat.

 

[mermshaus]

Älter wäre in diesem Fall IE6 und darunter.