mirror of
https://github.com/animate-css/animate.css.git
synced 2024-09-29 22:41:31 +02:00
Fix Firefox flip bug (#805)
This commit is contained in:
parent
f1853f76cf
commit
611b8cc98b
56
animate.css
vendored
56
animate.css
vendored
@ -1875,36 +1875,44 @@
|
|||||||
|
|
||||||
@-webkit-keyframes flip {
|
@-webkit-keyframes flip {
|
||||||
from {
|
from {
|
||||||
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
|
-webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0)
|
||||||
transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
|
rotate3d(0, 1, 0, -360deg);
|
||||||
|
transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, -360deg);
|
||||||
-webkit-animation-timing-function: ease-out;
|
-webkit-animation-timing-function: ease-out;
|
||||||
animation-timing-function: ease-out;
|
animation-timing-function: ease-out;
|
||||||
}
|
}
|
||||||
|
|
||||||
40% {
|
40% {
|
||||||
-webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
|
-webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
|
||||||
transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
|
rotate3d(0, 1, 0, -190deg);
|
||||||
|
transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
|
||||||
|
rotate3d(0, 1, 0, -190deg);
|
||||||
-webkit-animation-timing-function: ease-out;
|
-webkit-animation-timing-function: ease-out;
|
||||||
animation-timing-function: ease-out;
|
animation-timing-function: ease-out;
|
||||||
}
|
}
|
||||||
|
|
||||||
50% {
|
50% {
|
||||||
-webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
|
-webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
|
||||||
transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
|
rotate3d(0, 1, 0, -170deg);
|
||||||
|
transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
|
||||||
|
rotate3d(0, 1, 0, -170deg);
|
||||||
-webkit-animation-timing-function: ease-in;
|
-webkit-animation-timing-function: ease-in;
|
||||||
animation-timing-function: ease-in;
|
animation-timing-function: ease-in;
|
||||||
}
|
}
|
||||||
|
|
||||||
80% {
|
80% {
|
||||||
-webkit-transform: perspective(400px) scale3d(0.95, 0.95, 0.95);
|
-webkit-transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0)
|
||||||
transform: perspective(400px) scale3d(0.95, 0.95, 0.95);
|
rotate3d(0, 1, 0, 0deg);
|
||||||
|
transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0)
|
||||||
|
rotate3d(0, 1, 0, 0deg);
|
||||||
-webkit-animation-timing-function: ease-in;
|
-webkit-animation-timing-function: ease-in;
|
||||||
animation-timing-function: ease-in;
|
animation-timing-function: ease-in;
|
||||||
}
|
}
|
||||||
|
|
||||||
to {
|
to {
|
||||||
-webkit-transform: perspective(400px);
|
-webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0)
|
||||||
transform: perspective(400px);
|
rotate3d(0, 1, 0, 0deg);
|
||||||
|
transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
|
||||||
-webkit-animation-timing-function: ease-in;
|
-webkit-animation-timing-function: ease-in;
|
||||||
animation-timing-function: ease-in;
|
animation-timing-function: ease-in;
|
||||||
}
|
}
|
||||||
@ -1912,36 +1920,44 @@
|
|||||||
|
|
||||||
@keyframes flip {
|
@keyframes flip {
|
||||||
from {
|
from {
|
||||||
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
|
-webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0)
|
||||||
transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
|
rotate3d(0, 1, 0, -360deg);
|
||||||
|
transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, -360deg);
|
||||||
-webkit-animation-timing-function: ease-out;
|
-webkit-animation-timing-function: ease-out;
|
||||||
animation-timing-function: ease-out;
|
animation-timing-function: ease-out;
|
||||||
}
|
}
|
||||||
|
|
||||||
40% {
|
40% {
|
||||||
-webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
|
-webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
|
||||||
transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
|
rotate3d(0, 1, 0, -190deg);
|
||||||
|
transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
|
||||||
|
rotate3d(0, 1, 0, -190deg);
|
||||||
-webkit-animation-timing-function: ease-out;
|
-webkit-animation-timing-function: ease-out;
|
||||||
animation-timing-function: ease-out;
|
animation-timing-function: ease-out;
|
||||||
}
|
}
|
||||||
|
|
||||||
50% {
|
50% {
|
||||||
-webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
|
-webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
|
||||||
transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
|
rotate3d(0, 1, 0, -170deg);
|
||||||
|
transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
|
||||||
|
rotate3d(0, 1, 0, -170deg);
|
||||||
-webkit-animation-timing-function: ease-in;
|
-webkit-animation-timing-function: ease-in;
|
||||||
animation-timing-function: ease-in;
|
animation-timing-function: ease-in;
|
||||||
}
|
}
|
||||||
|
|
||||||
80% {
|
80% {
|
||||||
-webkit-transform: perspective(400px) scale3d(0.95, 0.95, 0.95);
|
-webkit-transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0)
|
||||||
transform: perspective(400px) scale3d(0.95, 0.95, 0.95);
|
rotate3d(0, 1, 0, 0deg);
|
||||||
|
transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0)
|
||||||
|
rotate3d(0, 1, 0, 0deg);
|
||||||
-webkit-animation-timing-function: ease-in;
|
-webkit-animation-timing-function: ease-in;
|
||||||
animation-timing-function: ease-in;
|
animation-timing-function: ease-in;
|
||||||
}
|
}
|
||||||
|
|
||||||
to {
|
to {
|
||||||
-webkit-transform: perspective(400px);
|
-webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0)
|
||||||
transform: perspective(400px);
|
rotate3d(0, 1, 0, 0deg);
|
||||||
|
transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
|
||||||
-webkit-animation-timing-function: ease-in;
|
-webkit-animation-timing-function: ease-in;
|
||||||
animation-timing-function: ease-in;
|
animation-timing-function: ease-in;
|
||||||
}
|
}
|
||||||
|
2
animate.min.css
vendored
2
animate.min.css
vendored
File diff suppressed because one or more lines are too long
@ -1,26 +1,29 @@
|
|||||||
@keyframes flip {
|
@keyframes flip {
|
||||||
from {
|
from {
|
||||||
transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
|
transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, -360deg);
|
||||||
animation-timing-function: ease-out;
|
animation-timing-function: ease-out;
|
||||||
}
|
}
|
||||||
|
|
||||||
40% {
|
40% {
|
||||||
transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
|
transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
|
||||||
|
rotate3d(0, 1, 0, -190deg);
|
||||||
animation-timing-function: ease-out;
|
animation-timing-function: ease-out;
|
||||||
}
|
}
|
||||||
|
|
||||||
50% {
|
50% {
|
||||||
transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
|
transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
|
||||||
|
rotate3d(0, 1, 0, -170deg);
|
||||||
animation-timing-function: ease-in;
|
animation-timing-function: ease-in;
|
||||||
}
|
}
|
||||||
|
|
||||||
80% {
|
80% {
|
||||||
transform: perspective(400px) scale3d(0.95, 0.95, 0.95);
|
transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0)
|
||||||
|
rotate3d(0, 1, 0, 0deg);
|
||||||
animation-timing-function: ease-in;
|
animation-timing-function: ease-in;
|
||||||
}
|
}
|
||||||
|
|
||||||
to {
|
to {
|
||||||
transform: perspective(400px);
|
transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
|
||||||
animation-timing-function: ease-in;
|
animation-timing-function: ease-in;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user