fade-in DOWN Problem

chefkoch89 · #1 (**permalink**) 25.06.2015, 17:12

Hallo Leute,

ich habe ein Problem mit einer CSS-Animation.
Und zwar arbeite ich mit einem Page-Builder in dem Boxen mit z.B. HTML-Schnipseln gefüllt werden.

Ich habe mir eine Class erstellt: <div class="wg_head"> und eine id #before-content41 ... die schon über css ein wenig hübsch gemacht ist (Abgerundete Boxen mit einem Hintergrundbild und einem Hovereffekt).

Nun möchte ich dass diese Boxen wenn die Seite aufgerufen wird mit einer fade-in DOWN Animation einblenden lassen.

Den Basis-Code für die Animation habe ich zwar, aber ich krieg es nicht hin die Animation korrekt zuzuordnen. Bitte helft mir

Code:

.animated { 
    -webkit-animation-duration: 1s; 
    animation-duration: 1s; 
    -webkit-animation-fill-mode: both; 
    animation-fill-mode: both; 
} 

@-webkit-keyframes fadeInDown { 
    0% { 
        opacity: 0; 
        -webkit-transform: translateY(-20px); 
    } 
    100% { 
        opacity: 1; 
        -webkit-transform: translateY(0); 
    } 
} 

@keyframes fadeInDown { 
    0% { 
        opacity: 0; 
        transform: translateY(-20px); 
    } 
    100% { 
        opacity: 1; 
        transform: translateY(0); 
    } 
} 

.fadeInDown { 
    -webkit-animation-name: fadeInDown; 
    animation-name: fadeInDown; 
}

chefkoch89 · #2 (**permalink**) 26.06.2015, 11:31

So habe nun mein Problem selber lösen können.
Wichtig war " animated fadeInDown" in den Klassennamen hinzuzufügen und die Animation in meiner indi.css richtig zu platzieren.

Themen-Optionen
Druckbare Version zeigen Jemanden per E-Mail auf dieses Thema hinweisen
Ansicht
Linear-Darstellung Zur Hybrid-Darstellung wechseln Zur Baum-Darstellung wechseln

Ähnliche Themen
Thema	Autor	Forum	Antworten	Letzter Beitrag
Problem mit CSS/Jquery Drop Down Menü	nightmind	CSS	17	09.07.2012 10:37
Drop Down Menu Problem	arosarius	CSS	6	02.05.2012 18:29
Problem mit Text neben Navigationsleiste	andi01	CSS	6	08.06.2011 16:54
Fade Effekt: Problem mit position absolute	Alien	CSS	0	14.05.2007 23:09
Drop Down Menu: focus Problem	enoo	CSS	8	20.03.2007 17:51