Bild und Text gleichzeitig bei hover ändern

[mic]

Hallo,

ist es mit CSS möglich, Bild und Text gleichzeitig bei hover zu ändern?
Konkrete Situation: Wenn ich mit der Maus über den Text fahre, soll dieser die Farbe ändern und zugleich das Bild einen farbigen Rahmen erhalten. Wenn ich mit der Maus über das Bild fahre, soll das Gleiche passieren.

Ist das mit CSS möglich oder benötige ich JavaScript? Da ich mich mit JavaScript nicht gut auskenne, bitte verständlich mit Beispiel erläutern.

Vielen Dank im Voraus!
Mic

[LX]

Wenn das Bild im gleichen Link-Tag steckt wie der Text, ist das durchaus mit CSS möglich. Die Positionierung mit CSS ist dabei durchaus flexibel.

Gruß, LX

[bleicher]

Grüße,
ja, das geht mit css, aber es könnte etwas unnötig komplex werden - uU wäre hier JS die einfachere methode

oder du versuchst dein glück mit css - für genauere tipps sollte man aber shcon wissen was genau du vorhast
MFG
bleicher

[mic]

Hallo,

das, was ich vorgabe, sieht so aus: Werkschau.
Bei MouseOver ändern sich Text und Bild.

Grüße
Mic

Grüße,
ja, das geht mit css, aber es könnte etwas unnötig komplex werden - uU wäre hier JS die einfachere methode

oder du versuchst dein glück mit css - für genauere tipps sollte man aber shcon wissen was genau du vorhast
MFG
bleicher

[bleicher]

Grüße,

Bei MouseOver ändern sich Text und Bild.

wie soll sich text ändern? style oder stringmäßig?
und so wie du es zeigst - nimm JS, sparst dir ein hirnkonoten oder zwei
MFG
bleicher

[Gunnar Bittersmann]

@@mic:

nuqneH

ist es mit CSS möglich, Bild und Text gleichzeitig bei hover zu ändern?

Ja.

Konkrete Situation:

Schön wär’s gewesen.

Qapla'

[mic]

Habe das Problem gelöst.

#gallery #slides div ul li a .eins img {display:block; width:100px; height:100px; border:2px solid #fff;}  
#gallery #slides div ul li a .eins img:hover {border:2px solid #C62021;}  
#gallery #slides div ul li a .eins span {color: #000; text-decoration: none; }  
#gallery #slides div ul li a .eins span:hover {color: #C62021;}  
  
.unten {position: absolute;padding-top:230px;font-size:14px;}

<div id="gallery">  
        <div id="slides">  
                <div id="slide1">  
                        <ul class="eins">  
  
                                <li><a href="#pic1" class="eins"><span class="unten">text 1</span><img src="bilder/01_06_01_th.jpg" alt="o. T., 2006" title="o. T., 2006" /></a></li>

Vielen Dank für die Hilfe.