Description
I would like to transition or fade in the content text one line at a time. I can get it to work on the first slide, but my css is running before it gets to the slide I need it to run on. Is there something I can do with the plugin to make my CSS run when the slide is present. This could also be an enhancement. In your dropdown for 'In Effect'...add 'fade in text one line at a time' or 'slide in text one line at a time'.
My CSS:
.fade-in {
opacity:0; /* make things invisible upon start /
-webkit-animation:fadeIn ease-in 1; / call our keyframe named fadeIn, use animattion ease-in and repeat it only 1 time */
-moz-animation:fadeIn ease-in 1;
animation:fadeIn ease-in 1;
-webkit-animation-fill-mode:forwards; /* this makes sure that after animation is done we remain at the last keyframe value (opacity: 1)*/
-moz-animation-fill-mode:forwards;
animation-fill-mode:forwards;
-webkit-animation-duration:1s;
-moz-animation-duration:1s;
animation-duration:1s;
}
.fade-in.one {
-webkit-animation-delay: 2s;
-moz-animation-delay: 2s;
animation-delay: 2s;
}
.fade-in.two {
-webkit-animation-delay: 3s;
-moz-animation-delay: 3s;
animation-delay: 3s;
}
.fade-in.three {
-webkit-animation-delay: 4s;
-moz-animation-delay: 4s;
animation-delay: 4s;
}
My Content Text: I know I'm missing <>, I wanted you to see what I had in the content.
div class="fade-in one"> look at me fade in /div
div class="fade-in two"> look at me fade in 2 seconds later /div
div class="fade-in three"> look at me fade in 3 seconds later /div
