webkit - Can ease-in and ease-out have different speeds for the css transition timing function? -
i'm trying have 1 element exit , 1 come in slow, want first element come in fast , second 1 exit fast too. possible? here's tried. deck.js slide set.
.slide.long.in { -webkit-transition: -webkit-transform 5000ms ease-in; transition: transform 5000ms ease-in; transition: transform 500ms ease-out; } .slide.long.out { -webkit-transition: -webkit-transform 5000ms ease-out; transition: transform 500ms ease-in; transition: transform 5000ms ease-out; }
deck.js has javascript functions change class on section if previous, current, or next. using imgonzalves hint, added following classes , seems work.
> .slide.long.in.deck-current { -webkit-transition: -webkit-transform 5000ms ease-in; transition: transform 2500ms ease-in; } > .slide.long.in.deck-next { -webkit-transition: -webkit-transform 500ms ease-out; transition: transform 500ms ease-out; } > .slide.long.in.deck-previous { -webkit-transition: -webkit-transform 500ms ease-out; transition: transform 500ms ease-out; } > .slide.long.out.deck-current { -webkit-transition: -webkit-transform 5000ms ease-out; transition: transform 500ms ease-out; } > .slide.long.out.deck-next { -webkit-transition: -webkit-transform 500ms ease-out; transition: transform 500ms ease-out; } > .slide.long.out.deck-previous { -webkit-transition: -webkit-transform 500ms ease-out; transition: transform 5000ms ease-out; }
Comments
Post a Comment