Hover Animation f
Auf einer Seite werden mehrere Bilder untereinander dargestellt:
http://i63.tinypic.com/2j49hn8.jpg Wird ein Bild gehovert, sollen weitere Bilder dazu angezeigt werden, mit einer Animation (ein Bild nach dem anderen, jeweils weniger Deckkraft): http://i64.tinypic.com/ix5b95.jpg http://i64.tinypic.com/ofu7nn.jpg http://i68.tinypic.com/ftg1og.jpg http://i66.tinypic.com/2s7xssh.jpg Klickt man dann auf das Bild, wird dann eine Seite mit einer grossen Galerie geöffnet. Ich habe bereits nach einer Lösung für die "aufpoppenden" Bilder gegoogelt, allerdings nichts passendes gefunden (vielleicht habe ich die falschen Suchbegriffe verwendet)... Irgendwelche Tipps? |
Tipp: Versuche es mit CSS3 Animationen. Du wirst aber für jedes Bild eine eigene Animation erstellen müssen, bzw. zeitversetzt starten müssen. Wrappe alle Bilder einer Zeile in einer Liste, fährst du nun über das erste Element blendest du nach und nach die Elemente mit CSS ein.
|
Ein Beispiel auf die Schnelle, kann man natürlich noch optimieren ;)
Hover Animation Zuerst baust du das von der Optik so auf das alle Elemente sichtbar sind. Dann vergibst du den divs die nicht gezeigt werden sollen ein display none mit der Klasse .hidden. Den Rest erledigst Du dann mit jQuery und der hover-Funktion. |
Alle Zeitangaben in WEZ +2. Es ist jetzt 23:03 Uhr. |
Powered by vBulletin® Version 3.8.11 (Deutsch)
Copyright ©2000 - 2024, vBulletin Solutions, Inc.
© Dirk H. 2003 - 2023