zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Hover Animation f

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 04.03.2016, 12:13
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 10.06.2010
Beiträge: 19
irenehofer befindet sich auf einem aufstrebenden Ast
Standard Hover Animation f

Auf einer Seite werden mehrere Bilder untereinander dargestellt:



Wird ein Bild gehovert, sollen weitere Bilder dazu angezeigt werden, mit einer Animation (ein Bild nach dem anderen, jeweils weniger Deckkraft):









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?
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 04.03.2016, 12:15
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 30.01.2014
Beiträge: 2.247
cloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblick
Standard

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.
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 08.03.2016, 05:09
Neuer Benutzer
neuer user
 
Registriert seit: 09.11.2005
Ort: München
Beiträge: 22
cgpro befindet sich auf einem aufstrebenden Ast
Standard

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.
__________________
I ♥ Webdesign
Mit Zitat antworten
Antwort

Stichwörter
animation, bilder, css

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Hilfe css Menu center xXcyberXx CSS 5 28.11.2010 20:51
Problem mit CSS Menü SMundt CSS 9 07.01.2009 20:12
CSS Navigation - Problem mit IE6 pcklinik CSS 4 18.09.2007 13:04
Darstellungsproblem CSS Navigation im IE7 pcklinik CSS 7 09.09.2007 18:25
CSS Einsteiger bittet um Hilfe pcklinik CSS 0 06.09.2007 15:40


Alle Zeitangaben in WEZ +2. Es ist jetzt 10:53 Uhr.