Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- .element-animation{
- animation: animationFrames ease-in 0.2s;
- animation-iteration-count: 1;
- transform-origin: 50% 50%;
- animation-fill-mode:forwards; /*when the spec is finished*/
- -webkit-animation: animationFrames ease-in 0.2s;
- -webkit-animation-iteration-count: 1;
- -webkit-transform-origin: 50% 50%;
- -webkit-animation-fill-mode:forwards; /*Chrome 16+, Safari 4+*/
- -moz-animation: animationFrames ease-in 0.2s;
- -moz-animation-iteration-count: 1;
- -moz-transform-origin: 50% 50%;
- -moz-animation-fill-mode:forwards; /*FF 5+*/
- -o-animation: animationFrames ease-in 0.2s;
- -o-animation-iteration-count: 1;
- -o-transform-origin: 50% 50%;
- -o-animation-fill-mode:forwards; /*Not implemented yet*/
- -ms-animation: animationFrames ease-in 0.2s;
- -ms-animation-iteration-count: 1;
- -ms-transform-origin: 50% 50%;
- -ms-animation-fill-mode:forwards; /*IE 10+*/
- }
- @keyframes animationFrames{
- 0% {
- opacity:0;
- transform: scaleX(1.00) scaleY(1.00) ;
- }
- 50% {
- opacity:1;
- transform: scaleX(1.20) scaleY(1.20) ;
- }
- 100% {
- opacity:1;
- transform: scaleX(1.00) scaleY(1.00) ;
- }
- }
- @-moz-keyframes animationFrames{
- 0% {
- opacity:0;
- -moz-transform: scaleX(1.00) scaleY(1.00) ;
- }
- 50% {
- opacity:1;
- -moz-transform: scaleX(1.20) scaleY(1.20) ;
- }
- 100% {
- opacity:1;
- -moz-transform: scaleX(1.00) scaleY(1.00) ;
- }
- }
- @-webkit-keyframes animationFrames {
- 0% {
- opacity:0;
- -webkit-transform: scaleX(1.00) scaleY(1.00) ;
- }
- 50% {
- opacity:1;
- -webkit-transform: scaleX(1.20) scaleY(1.20) ;
- }
- 100% {
- opacity:1;
- -webkit-transform: scaleX(1.00) scaleY(1.00) ;
- }
- }
- @-o-keyframes animationFrames {
- 0% {
- opacity:0;
- -o-transform: scaleX(1.00) scaleY(1.00) ;
- }
- 50% {
- opacity:1;
- -o-transform: scaleX(1.20) scaleY(1.20) ;
- }
- 100% {
- opacity:1;
- -o-transform: scaleX(1.00) scaleY(1.00) ;
- }
- }
- @-ms-keyframes animationFrames {
- 0% {
- opacity:0;
- -ms-transform: scaleX(1.00) scaleY(1.00) ;
- }
- 50% {
- opacity:1;
- -ms-transform: scaleX(1.20) scaleY(1.20) ;
- }
- 100% {
- opacity:1;
- -ms-transform: scaleX(1.00) scaleY(1.00) ;
- }
- }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement