molily: Fade-in Zielseite bei Seitenwechsel

Beitrag lesen

Du kannst die Animation auch auf Klicken auslösen. Dazu fügst du einem Element einen click-Handler hinzu, der beim einzublendenden Element eine Klasse setzt. Diese Klasse bekommt die CSS-Eigenschaft animation: …;, womit die Animation startet. Dann muss man aber dafür sorgen, dass in Browsern, die Animationen nicht unterstützen, die Inhalte gar nicht erst ausgeblendet werden.

Ich habe das mal beispielhaft umgesetzt:
http://jsfiddle.net/molily/unuHb/

Da diese Funktionalität einfacher ist, braucht es keine CSS-Keyframe-Animationen, sondern eine CSS-Transition (transition: opacity 1s;) reicht aus.

Über Feedback und Verbesserungsvorschläge würde ich mich freuen.

Mathias