Alex: Bildwechsel per css

Beitrag lesen

Hallo Jürgen,

ich habe mal meine Spiralenseite umgebaut, der Bildwechsel geht jetzt über css:

figcaption { text-align:center; margin-bottom:0.5em }

.bild_bild img { position:absolute; opacity:1 }
.bild_bild img + img { position:static; opacity:0 }
.bild_bild:hover img { opacity:0 }
.bild_bild:hover img + img { opacity:1 }
img { transition: opacity 2s }


>   
> ~~~html

<figure class="bild_bild">  

>  <img src="Sonnenblume.jpg" alt="Sonnenblume"><img src="Sonnenblume_Mitte.jpg" alt="Sonnenblume Ausschnitt">  
>  <figcaption>Sonnenblume<br><span class="kleiner">(Mouseover vergrößert die Mitte)</span></figcaption>  
> </figure>

vielen lieben Dank für das Beispiel, ich werde es gleich mal bei mir einbauen, vielleicht kommen ich ja doch noch an mein Ziel. Aber eine Frage habe ich noch, was soll das img + img? Ist das so richtig und geht das auch in älteren IE (bis IE sagen wir mal 9 oder 10)?