Robot/animate.css
1
0
Fork 0
mirror of https://github.com/animate-css/animate.css.git synced 2024-10-01 07:21:31 +02:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #14 from suissa/master

Browse Source 
Add opera support
This commit is contained in:
Dan Eden 2011-10-20 12:26:13 -07:00
commit 99e4bc5c91
30 changed files with 340 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
source/bounce.css
View File

@ -31,5 +31,6 @@
-webkit-animation-name: bounce; -webkit-animation-name: bounce;
-moz-animation-name: bounce; -moz-animation-name: bounce;
-ms-animation-name: bounce; -ms-animation-name: bounce;
-o-animation-name: bounce;
animation-name: bounce; animation-name: bounce;
} }

1
source/bounceIn.css
View File

@ -102,5 +102,6 @@
-webkit-animation-name: bounceIn; -webkit-animation-name: bounceIn;
-moz-animation-name: bounceIn; -moz-animation-name: bounceIn;
-ms-animation-name: bounceIn; -ms-animation-name: bounceIn;
-o-animation-name: bounceIn;
animation-name: bounceIn; animation-name: bounceIn;
} }

1
source/bounceInDown.css
View File

@ -102,5 +102,6 @@
-webkit-animation-name: bounceInDown; -webkit-animation-name: bounceInDown;
-moz-animation-name: bounceInDown; -moz-animation-name: bounceInDown;
-ms-animation-name: bounceInDown; -ms-animation-name: bounceInDown;
-o-animation-name: bounceInDown;
animation-name: bounceInDown; animation-name: bounceInDown;
} }

1
source/bounceInLeft.css
View File

@ -102,5 +102,6 @@
-webkit-animation-name: bounceInLeft; -webkit-animation-name: bounceInLeft;
-moz-animation-name: bounceInLeft; -moz-animation-name: bounceInLeft;
-ms-animation-name: bounceInLeft; -ms-animation-name: bounceInLeft;
-o-animation-name: bounceInLeft;
animation-name: bounceInLeft; animation-name: bounceInLeft;
} }

1
source/bounceInRight.css
View File

@ -102,5 +102,6 @@
-webkit-animation-name: bounceInRight; -webkit-animation-name: bounceInRight;
-moz-animation-name: bounceInRight; -moz-animation-name: bounceInRight;
-ms-animation-name: bounceInRight; -ms-animation-name: bounceInRight;
-o-animation-name: bounceInRight;
animation-name: bounceInRight; animation-name: bounceInRight;
} }

22
source/bounceInUp.css
View File

@ -55,6 +55,27 @@
-ms-transform: translateY(0); -ms-transform: translateY(0);
} }
} }
@-o-keyframes bounceInUp {
0% {
opacity: 0;
-o-transform: translateY(2000px);
}
60% {
opacity: 1;
-o-transform: translateY(-30px);
}
80% {
-o-transform: translateY(10px);
}
100% {
-o-transform: translateY(0);
}
}
@keyframes bounceInUp { @keyframes bounceInUp {
0% { 0% {
opacity: 0; opacity: 0;
@ -79,5 +100,6 @@
-webkit-animation-name: bounceInUp; -webkit-animation-name: bounceInUp;
-moz-animation-name: bounceInUp; -moz-animation-name: bounceInUp;
-ms-animation-name: bounceInUp; -ms-animation-name: bounceInUp;
-o-animation-name: bounceInUp;
animation-name: bounceInUp; animation-name: bounceInUp;
} }

21
source/bounceOut.css
View File

@ -58,6 +58,26 @@
} }
} }
@-o-keyframes bounceOut {
0% {
-o-transform: scale(1);
}
25% {
-o-transform: scale(.95);
}
50% {
opacity: 1;
-o-transform: scale(1.1);
}
100% {
opacity: 0;
-o-transform: scale(.3);
}
}
@keyframes bounceOut { @keyframes bounceOut {
0% { 0% {
transform: scale(1); transform: scale(1);
@ -82,5 +102,6 @@
-webkit-animation-name: bounceOut; -webkit-animation-name: bounceOut;
-moz-animation-name: bounceOut; -moz-animation-name: bounceOut;
-ms-animation-name: bounceOut; -ms-animation-name: bounceOut;
-o-animation-name: bounceOut;
animation-name: bounceOut; animation-name: bounceOut;
} }

17
source/bounceOutLeft.css
View File

@ -46,6 +46,22 @@
} }
} }
@-o-keyframes bounceOutLeft {
0% {
-o-transform: translateX(0);
}
20% {
opacity: 1;
-o-transform: translateX(20px);
}
100% {
opacity: 0;
-o-transform: translateX(-2000px);
}
}
@keyframes bounceOutLeft { @keyframes bounceOutLeft {
0% { 0% {
transform: translateX(0); transform: translateX(0);
@ -66,5 +82,6 @@
-webkit-animation-name: bounceOutLeft; -webkit-animation-name: bounceOutLeft;
-moz-animation-name: bounceOutLeft; -moz-animation-name: bounceOutLeft;
-ms-animation-name: bounceOutLeft; -ms-animation-name: bounceOutLeft;
-o-animation-name: bounceOutLeft;
animation-name: bounceOutLeft; animation-name: bounceOutLeft;
} }

17
source/bounceOutRight.css
View File

@ -46,6 +46,22 @@
} }
} }
@-o-keyframes bounceOutRight {
0% {
-o-transform: translateX(0);
}
20% {
opacity: 1;
-o-transform: translateX(-20px);
}
100% {
opacity: 0;
-o-transform: translateX(2000px);
}
}
@keyframes bounceOutRight { @keyframes bounceOutRight {
0% { 0% {
transform: translateX(0); transform: translateX(0);
@ -66,5 +82,6 @@
-webkit-animation-name: bounceOutRight; -webkit-animation-name: bounceOutRight;
-moz-animation-name: bounceOutRight; -moz-animation-name: bounceOutRight;
-ms-animation-name: bounceOutRight; -ms-animation-name: bounceOutRight;
-o-animation-name: bounceOutRight;
animation-name: bounceOutRight; animation-name: bounceOutRight;
} }

17
source/bounceOutUp.css
View File

@ -46,6 +46,22 @@
} }
} }
@-o-keyframes bounceOutUp {
0% {
-o-transform: translateY(0);
}
20% {
opacity: 1;
-o-transform: translateY(20px);
}
100% {
opacity: 0;
-o-transform: translateY(-2000px);
}
}
@keyframes bounceOutUp { @keyframes bounceOutUp {
0% { 0% {
transform: translateY(0); transform: translateY(0);
@ -66,5 +82,6 @@
-webkit-animation-name: bounceOutUp; -webkit-animation-name: bounceOutUp;
-moz-animation-name: bounceOutUp; -moz-animation-name: bounceOutUp;
-ms-animation-name: bounceOutUp; -ms-animation-name: bounceOutUp;
-o-animation-name: bounceOutUp;
animation-name: bounceOutUp; animation-name: bounceOutUp;
} }

17
source/bounceOutdown.css
View File

@ -46,6 +46,22 @@
} }
} }
@-o-keyframes bounceOutDown {
0% {
-o-transform: translateY(0);
}
20% {
opacity: 1;
-o-transform: translateY(-20px);
}
100% {
opacity: 0;
-o-transform: translateY(2000px);
}
}
@keyframes bounceOutDown { @keyframes bounceOutDown {
0% { 0% {
transform: translateY(0); transform: translateY(0);
@ -66,5 +82,6 @@
-webkit-animation-name: bounceOutDown; -webkit-animation-name: bounceOutDown;
-moz-animation-name: bounceOutDown; -moz-animation-name: bounceOutDown;
-ms-animation-name: bounceOutDown; -ms-animation-name: bounceOutDown;
-o-animation-name: bounceOutDown;
animation-name: bounceOutDown; animation-name: bounceOutDown;
} }

6
source/fadeIn.css
View File

@ -13,6 +13,11 @@
100% {opacity: 1;} 100% {opacity: 1;}
} }
@-o-keyframes fadeIn {
0% {opacity: 0;}
100% {opacity: 1;}
}
@keyframes fadeIn { @keyframes fadeIn {
0% {opacity: 0;} 0% {opacity: 0;}
100% {opacity: 1;} 100% {opacity: 1;}
@ -22,5 +27,6 @@
-webkit-animation-name: fadeIn; -webkit-animation-name: fadeIn;
-moz-animation-name: fadeIn; -moz-animation-name: fadeIn;
-ms-animation-name: fadeIn; -ms-animation-name: fadeIn;
-o-animation-name: fadeIn;
animation-name: fadeIn; animation-name: fadeIn;
} }

13
source/fadeInDown.css
View File

@ -34,6 +34,18 @@
} }
} }
@-o-keyframes fadeInDown {
0% {
opacity: 0;
-ms-transform: translateY(-20px);
}
100% {
opacity: 1;
-ms-transform: translateY(0);
}
}
@keyframes fadeInDown { @keyframes fadeInDown {
0% { 0% {
opacity: 0; opacity: 0;
@ -50,5 +62,6 @@
-webkit-animation-name: fadeInDown; -webkit-animation-name: fadeInDown;
-moz-animation-name: fadeInDown; -moz-animation-name: fadeInDown;
-ms-animation-name: fadeInDown; -ms-animation-name: fadeInDown;
-o-animation-name: fadeInDown;
animation-name: fadeInDown; animation-name: fadeInDown;
} }

13
source/fadeInDownBig.css
View File

@ -34,6 +34,18 @@
} }
} }
@-o-keyframes fadeInDownBig {
0% {
opacity: 0;
-o-transform: translateY(-2000px);
}
100% {
opacity: 1;
-o-transform: translateY(0);
}
}
@keyframes fadeInDownBig { @keyframes fadeInDownBig {
0% { 0% {
opacity: 0; opacity: 0;
@ -50,5 +62,6 @@
-webkit-animation-name: fadeInDownBig; -webkit-animation-name: fadeInDownBig;
-moz-animation-name: fadeInDownBig; -moz-animation-name: fadeInDownBig;
-ms-animation-name: fadeInDownBig; -ms-animation-name: fadeInDownBig;
-o-animation-name: fadeInDownBig;
animation-name: fadeInDownBig; animation-name: fadeInDownBig;
} }

13
source/fadeInLeft.css
View File

@ -34,6 +34,18 @@
} }
} }
@-o-keyframes fadeInLeft {
0% {
opacity: 0;
-o-transform: translateX(-20px);
}
100% {
opacity: 1;
-o-transform: translateX(0);
}
}
@keyframes fadeInLeft { @keyframes fadeInLeft {
0% { 0% {
opacity: 0; opacity: 0;
@ -50,5 +62,6 @@
-webkit-animation-name: fadeInLeft; -webkit-animation-name: fadeInLeft;
-moz-animation-name: fadeInLeft; -moz-animation-name: fadeInLeft;
-ms-animation-name: fadeInLeft; -ms-animation-name: fadeInLeft;
-o-animation-name: fadeInLeft;
animation-name: fadeInLeft; animation-name: fadeInLeft;
} }

12
source/fadeInLeftBig.css
View File

@ -31,6 +31,17 @@
-ms-transform: translateX(0); -ms-transform: translateX(0);
} }
} }
@-o-keyframes fadeInLeftBig {
0% {
opacity: 0;
-o-transform: translateX(-2000px);
}
100% {
opacity: 1;
-o-transform: translateX(0);
}
}
@keyframes fadeInLeftBig { @keyframes fadeInLeftBig {
0% { 0% {
opacity: 0; opacity: 0;
@ -47,5 +58,6 @@
-webkit-animation-name: fadeInLeftBig; -webkit-animation-name: fadeInLeftBig;
-moz-animation-name: fadeInLeftBig; -moz-animation-name: fadeInLeftBig;
-ms-animation-name: fadeInLeftBig; -ms-animation-name: fadeInLeftBig;
-o-animation-name: fadeInLeftBig;
animation-name: fadeInLeftBig; animation-name: fadeInLeftBig;
} }

13
source/fadeInRight.css
View File

@ -34,6 +34,18 @@
} }
} }
@-o-keyframes fadeInRight {
0% {
opacity: 0;
-o-transform: translateX(20px);
}
100% {
opacity: 1;
-o-transform: translateX(0);
}
}
@keyframes fadeInRight { @keyframes fadeInRight {
0% { 0% {
opacity: 0; opacity: 0;
@ -50,5 +62,6 @@
-webkit-animation-name: fadeInRight; -webkit-animation-name: fadeInRight;
-moz-animation-name: fadeInRight; -moz-animation-name: fadeInRight;
-ms-animation-name: fadeInRight; -ms-animation-name: fadeInRight;
-o-animation-name: fadeInRight;
animation-name: fadeInRight; animation-name: fadeInRight;
} }

13
source/fadeInRightBig.css
View File

@ -34,6 +34,18 @@
} }
} }
@-o-keyframes fadeInRightBig {
0% {
opacity: 0;
-o-transform: translateX(2000px);
}
100% {
opacity: 1;
-o-transform: translateX(0);
}
}
@keyframes fadeInRightBig { @keyframes fadeInRightBig {
0% { 0% {
opacity: 0; opacity: 0;
@ -50,5 +62,6 @@
-webkit-animation-name: fadeInRightBig; -webkit-animation-name: fadeInRightBig;
-moz-animation-name: fadeInRightBig; -moz-animation-name: fadeInRightBig;
-ms-animation-name: fadeInRightBig; -ms-animation-name: fadeInRightBig;
-o-animation-name: fadeInRightBig;
animation-name: fadeInRightBig; animation-name: fadeInRightBig;
} }

13
source/fadeInUp.css
View File

@ -34,6 +34,18 @@
} }
} }
@-o-keyframes fadeInUp {
0% {
opacity: 0;
-o-transform: translateY(20px);
}
100% {
opacity: 1;
-o-transform: translateY(0);
}
}
@keyframes fadeInUp { @keyframes fadeInUp {
0% { 0% {
opacity: 0; opacity: 0;
@ -50,5 +62,6 @@
-webkit-animation-name: fadeInUp; -webkit-animation-name: fadeInUp;
-moz-animation-name: fadeInUp; -moz-animation-name: fadeInUp;
-ms-animation-name: fadeInUp; -ms-animation-name: fadeInUp;
-o-animation-name: fadeInUp;
animation-name: fadeInUp; animation-name: fadeInUp;
} }

13
source/fadeInUpBig.css
View File

@ -34,6 +34,18 @@
} }
} }
@-o-keyframes fadeInUpBig {
0% {
opacity: 0;
-o-transform: translateY(2000px);
}
100% {
opacity: 1;
-o-transform: translateY(0);
}
}
@keyframes fadeInUpBig { @keyframes fadeInUpBig {
0% { 0% {
opacity: 0; opacity: 0;
@ -50,5 +62,6 @@
-webkit-animation-name: fadeInUpBig; -webkit-animation-name: fadeInUpBig;
-moz-animation-name: fadeInUpBig; -moz-animation-name: fadeInUpBig;
-ms-animation-name: fadeInUpBig; -ms-animation-name: fadeInUpBig;
-o-animation-name: fadeInUpBig;
animation-name: fadeInUpBig; animation-name: fadeInUpBig;
} }

6
source/fadeOut.css
View File

@ -13,6 +13,11 @@
100% {opacity: 0;} 100% {opacity: 0;}
} }
@-o-keyframes fadeOut {
0% {opacity: 1;}
100% {opacity: 0;}
}
@keyframes fadeOut { @keyframes fadeOut {
0% {opacity: 1;} 0% {opacity: 1;}
100% {opacity: 0;} 100% {opacity: 0;}
@ -22,5 +27,6 @@
-webkit-animation-name: fadeOut; -webkit-animation-name: fadeOut;
-moz-animation-name: fadeOut; -moz-animation-name: fadeOut;
-ms-animation-name: fadeOut; -ms-animation-name: fadeOut;
-o-animation-name: fadeOut;
animation-name: fadeOut; animation-name: fadeOut;
} }

13
source/fadeOutDown.css
View File

@ -34,6 +34,18 @@
} }
} }
@-o-keyframes fadeOutDown {
0% {
opacity: 1;
-o-transform: translateY(0);
}
100% {
opacity: 0;
-o-transform: translateY(20px);
}
}
@keyframes fadeOutDown { @keyframes fadeOutDown {
0% { 0% {
opacity: 1; opacity: 1;
@ -50,5 +62,6 @@
-webkit-animation-name: fadeOutDown; -webkit-animation-name: fadeOutDown;
-moz-animation-name: fadeOutDown; -moz-animation-name: fadeOutDown;
-ms-animation-name: fadeOutDown; -ms-animation-name: fadeOutDown;
-o-animation-name: fadeOutDown;
animation-name: fadeOutDown; animation-name: fadeOutDown;
} }

13
source/fadeOutDownBig.css
View File

@ -34,6 +34,18 @@
} }
} }
@-o-keyframes fadeOutDownBig {
0% {
opacity: 1;
-o-transform: translateY(0);
}
100% {
opacity: 0;
-o-transform: translateY(2000px);
}
}
@keyframes fadeOutDownBig { @keyframes fadeOutDownBig {
0% { 0% {
opacity: 1; opacity: 1;
@ -50,5 +62,6 @@
-webkit-animation-name: fadeOutDownBig; -webkit-animation-name: fadeOutDownBig;
-moz-animation-name: fadeOutDownBig; -moz-animation-name: fadeOutDownBig;
-ms-animation-name: fadeOutDownBig; -ms-animation-name: fadeOutDownBig;
-o-animation-name: fadeOutDownBig;
animation-name: fadeOutDownBig; animation-name: fadeOutDownBig;
} }

14
source/fadeOutLeft.css
View File

@ -33,6 +33,19 @@
-ms-transform: translateX(-20px); -ms-transform: translateX(-20px);
} }
} }
@-o-keyframes fadeOutLeft {
0% {
opacity: 1;
-o-transform: translateX(0);
}
100% {
opacity: 0;
-o-transform: translateX(-20px);
}
}
@keyframes fadeOutLeft { @keyframes fadeOutLeft {
0% { 0% {
opacity: 1; opacity: 1;
@ -49,5 +62,6 @@
-webkit-animation-name: fadeOutLeft; -webkit-animation-name: fadeOutLeft;
-moz-animation-name: fadeOutLeft; -moz-animation-name: fadeOutLeft;
-ms-animation-name: fadeOutLeft; -ms-animation-name: fadeOutLeft;
-o-animation-name: fadeOutLeft;
animation-name: fadeOutLeft; animation-name: fadeOutLeft;
} }

13
source/fadeOutLeftBig.css
View File

@ -34,6 +34,18 @@
} }
} }
@-o-keyframes fadeOutLeftBig {
0% {
opacity: 1;
-o-transform: translateX(0);
}
100% {
opacity: 0;
-o-transform: translateX(-2000px);
}
}
@keyframes fadeOutLeftBig { @keyframes fadeOutLeftBig {
0% { 0% {
opacity: 1; opacity: 1;
@ -50,5 +62,6 @@
-webkit-animation-name: fadeOutLeftBig; -webkit-animation-name: fadeOutLeftBig;
-moz-animation-name: fadeOutLeftBig; -moz-animation-name: fadeOutLeftBig;
-ms-animation-name: fadeOutLeftBig; -ms-animation-name: fadeOutLeftBig;
-o-animation-name: fadeOutLeftBig;
animation-name: fadeOutLeftBig; animation-name: fadeOutLeftBig;
} }

13
source/fadeOutRight.css
View File

@ -34,6 +34,18 @@
} }
} }
@-o-keyframes fadeOutRight {
0% {
opacity: 1;
-o-transform: translateX(0);
}
100% {
opacity: 0;
-o-transform: translateX(20px);
}
}
@keyframes fadeOutRight { @keyframes fadeOutRight {
0% { 0% {
opacity: 1; opacity: 1;
@ -50,5 +62,6 @@
-webkit-animation-name: fadeOutRight; -webkit-animation-name: fadeOutRight;
-moz-animation-name: fadeOutRight; -moz-animation-name: fadeOutRight;
-ms-animation-name: fadeOutRight; -ms-animation-name: fadeOutRight;
-o-animation-name: fadeOutRight;
animation-name: fadeOutRight; animation-name: fadeOutRight;
} }

12
source/fadeOutRightBig.css
View File

@ -31,6 +31,17 @@
-ms-transform: translateX(2000px); -ms-transform: translateX(2000px);
} }
} }
@-o-keyframes fadeOutRightBig {
0% {
opacity: 1;
-o-transform: translateX(0);
}
100% {
opacity: 0;
-o-transform: translateX(2000px);
}
}
@keyframes fadeOutRightBig { @keyframes fadeOutRightBig {
0% { 0% {
opacity: 1; opacity: 1;
@ -47,5 +58,6 @@
-webkit-animation-name: fadeOutRightBig; -webkit-animation-name: fadeOutRightBig;
-moz-animation-name: fadeOutRightBig; -moz-animation-name: fadeOutRightBig;
-ms-animation-name: fadeOutRightBig; -ms-animation-name: fadeOutRightBig;
-o-animation-name: fadeOutRightBig;
animation-name: fadeOutRightBig; animation-name: fadeOutRightBig;
} }

12
source/fadeOutUp.css
View File

@ -31,6 +31,17 @@
-ms-transform: translateY(-20px); -ms-transform: translateY(-20px);
} }
} }
@-o-keyframes fadeOutUp {
0% {
opacity: 1;
-o-transform: translateY(0);
}
100% {
opacity: 0;
-o-transform: translateY(-20px);
}
}
@keyframes fadeOutUp { @keyframes fadeOutUp {
0% { 0% {
opacity: 1; opacity: 1;
@ -47,5 +58,6 @@
-webkit-animation-name: fadeOutUp; -webkit-animation-name: fadeOutUp;
-moz-animation-name: fadeOutUp; -moz-animation-name: fadeOutUp;
-ms-animation-name: fadeOutUp; -ms-animation-name: fadeOutUp;
-o-animation-name: fadeOutUp;
animation-name: fadeOutUp; animation-name: fadeOutUp;
} }

13
source/fadeOutUpBig.css
View File

@ -34,6 +34,18 @@
} }
} }
@-o-keyframes fadeOutUpBig {
0% {
opacity: 1;
-o-transform: translateY(0);
}
100% {
opacity: 0;
-o-transform: translateY(-2000px);
}
}
@keyframes fadeOutUpBig { @keyframes fadeOutUpBig {
0% { 0% {
opacity: 1; opacity: 1;
@ -50,5 +62,6 @@
-webkit-animation-name: fadeOutUpBig; -webkit-animation-name: fadeOutUpBig;
-moz-animation-name: fadeOutUpBig; -moz-animation-name: fadeOutUpBig;
-ms-animation-name: fadeOutUpBig; -ms-animation-name: fadeOutUpBig;
-o-animation-name: fadeOutUpBig;
animation-name: fadeOutUpBig; animation-name: fadeOutUpBig;
} }

6
source/flash.css
View File

@ -13,6 +13,11 @@
25%, 75% {opacity: 0;} 25%, 75% {opacity: 0;}
} }
@-o-keyframes flash {
0%, 50%, 100% {opacity: 1;}
25%, 75% {opacity: 0;}
}
@keyframes flash { @keyframes flash {
0%, 50%, 100% {opacity: 1;} 0%, 50%, 100% {opacity: 1;}
25%, 75% {opacity: 0;} 25%, 75% {opacity: 0;}
@ -22,5 +27,6 @@
-webkit-animation-name: flash; -webkit-animation-name: flash;
-moz-animation-name: flash; -moz-animation-name: flash;
-ms-animation-name: flash; -ms-animation-name: flash;
-o-animation-name: flash;
animation-name: flash; animation-name: flash;
} }