Merge pull request #95 from gpetrov/master

Fixed Flip in latest Chrome, FF and IE
This commit is contained in:
Daniel Eden 2013-08-15 14:11:43 -07:00
commit 8482351665

32
animate.css vendored
View file

@ -277,11 +277,11 @@ body { /* Addresses a small issue in webkit: http://bit.ly/NEdoDq */
} }
@-webkit-keyframes flip { @-webkit-keyframes flip {
0% { 0% {
-webkit-transform: perspective(400px) rotateY(0); -webkit-transform: perspective(400px) translateZ(0) rotateY(0) scale(1);
-webkit-animation-timing-function: ease-out; -webkit-animation-timing-function: ease-out;
} }
40% { 40% {
-webkit-transform: perspective(400px) translateZ(150px) rotateY(170deg); -webkit-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1);
-webkit-animation-timing-function: ease-out; -webkit-animation-timing-function: ease-out;
} }
50% { 50% {
@ -289,21 +289,21 @@ body { /* Addresses a small issue in webkit: http://bit.ly/NEdoDq */
-webkit-animation-timing-function: ease-in; -webkit-animation-timing-function: ease-in;
} }
80% { 80% {
-webkit-transform: perspective(400px) rotateY(360deg) scale(.95); -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95);
-webkit-animation-timing-function: ease-in; -webkit-animation-timing-function: ease-in;
} }
100% { 100% {
-webkit-transform: perspective(400px) scale(1); -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1);
-webkit-animation-timing-function: ease-in; -webkit-animation-timing-function: ease-in;
} }
} }
@-moz-keyframes flip { @-moz-keyframes flip {
0% { 0% {
-moz-transform: perspective(400px) rotateY(0); -moz-transform: perspective(400px) translateZ(0) rotateY(0) scale(1);
-moz-animation-timing-function: ease-out; -moz-animation-timing-function: ease-out;
} }
40% { 40% {
-moz-transform: perspective(400px) translateZ(150px) rotateY(170deg); -moz-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1);
-moz-animation-timing-function: ease-out; -moz-animation-timing-function: ease-out;
} }
50% { 50% {
@ -311,21 +311,21 @@ body { /* Addresses a small issue in webkit: http://bit.ly/NEdoDq */
-moz-animation-timing-function: ease-in; -moz-animation-timing-function: ease-in;
} }
80% { 80% {
-moz-transform: perspective(400px) rotateY(360deg) scale(.95); -moz-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95);
-moz-animation-timing-function: ease-in; -moz-animation-timing-function: ease-in;
} }
100% { 100% {
-moz-transform: perspective(400px) scale(1); -moz-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1);
-moz-animation-timing-function: ease-in; -moz-animation-timing-function: ease-in;
} }
} }
@-o-keyframes flip { @-o-keyframes flip {
0% { 0% {
-o-transform: perspective(400px) rotateY(0); -o-transform: perspective(400px) translateZ(0) rotateY(0) scale(1);
-o-animation-timing-function: ease-out; -o-animation-timing-function: ease-out;
} }
40% { 40% {
-o-transform: perspective(400px) translateZ(150px) rotateY(170deg); -o-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1);
-o-animation-timing-function: ease-out; -o-animation-timing-function: ease-out;
} }
50% { 50% {
@ -333,21 +333,21 @@ body { /* Addresses a small issue in webkit: http://bit.ly/NEdoDq */
-o-animation-timing-function: ease-in; -o-animation-timing-function: ease-in;
} }
80% { 80% {
-o-transform: perspective(400px) rotateY(360deg) scale(.95); -o-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95);
-o-animation-timing-function: ease-in; -o-animation-timing-function: ease-in;
} }
100% { 100% {
-o-transform: perspective(400px) scale(1); -o-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1);
-o-animation-timing-function: ease-in; -o-animation-timing-function: ease-in;
} }
} }
@keyframes flip { @keyframes flip {
0% { 0% {
transform: perspective(400px) rotateY(0); transform: perspective(400px) translateZ(0) rotateY(0) scale(1);
animation-timing-function: ease-out; animation-timing-function: ease-out;
} }
40% { 40% {
transform: perspective(400px) translateZ(150px) rotateY(170deg); transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1);
animation-timing-function: ease-out; animation-timing-function: ease-out;
} }
50% { 50% {
@ -355,11 +355,11 @@ body { /* Addresses a small issue in webkit: http://bit.ly/NEdoDq */
animation-timing-function: ease-in; animation-timing-function: ease-in;
} }
80% { 80% {
transform: perspective(400px) rotateY(360deg) scale(.95); transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95);
animation-timing-function: ease-in; animation-timing-function: ease-in;
} }
100% { 100% {
transform: perspective(400px) scale(1); transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1);
animation-timing-function: ease-in; animation-timing-function: ease-in;
} }
} }