Robot/animate.css
1
0
Fork 0
mirror of https://github.com/animate-css/animate.css.git synced 2024-11-13 07:41:08 +01:00
Code Issues Projects Releases Packages Wiki Activity

Merge pull request #95 from gpetrov/master

Browse source 
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
1 changed files with 16 additions and 16 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

32
animate.css vendored
View file

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