Hallo Zusammen, habe mal ein wenig mit CSS transition gespielt. Mir gefällt der Überblendungs-Effekt. Code aus folgender Seite [Linkbeschreibung](http://www.mediaevent.de/css/transition.html) Leider finde ich nur keine sinnvolle Methode, mit folgender Konstellation Verlinkungen zu erstellen. Die DIV-Elemente inkl. Bilder sollten als Navigation dienen. Verlinkung innerhalb einzelner Seiten. Hat jemand eine Idee? ~~~html <div id="subbox1" style="width:113px; height:113px;"> <img src="bilder/piktos/pikto1_c_klasse_hover.png"/> <img id="top" src="bilder/piktos/pikto1_c_klasse.png" /> </div> ~~~ ~~~css #subbox1 { position: relative;float: left; margin-right: 20px;} #subbox1 img#top:hover { opacity:0 } #subbox1 img { position: absolute; float: left; top: 0; left: 0; opacity: 1; transition: opacity 1s } ~~~

Hallo Zusammen, habe mal ein wenig mit CSS transition gespielt. Mir gefällt der Überbblendungs-Effekt. Code aus folgender Seite [Linkbeschreibung](http://www.mediaevent.de/css/transition.html) Leider finde ich nur keine sinnvolle Methode, mit folgender Konstellation Verlinkungen zu erstellen. Die DIV-Elemente inkl. Bilder sollten als Navigation dienen. Verlinkung innerhalb einzelner Seiten. Hat jemand eine Idee? ~~~html <div id="subbox1" style="width:113px; height:113px;"> <img src="bilder/piktos/pikto1_c_klasse_hover.png"/> <img id="top" src="bilder/piktos/pikto1_c_klasse.png" /> </div> ~~~ ~~~css #subbox1 { position: relative;float: left; margin-right: 20px;} #subbox1 img#top:hover { opacity:0 } #subbox1 img { position: absolute; float: left; top: 0; left: 0; opacity: 1; transition: opacity 1s } ~~~