通过CSS实现网页中动画效果的展示,以View的放大缩小为例:
animation:change linear 1.2s infinite;
-moz-animation:change linear 1.2s infinite;
-webkit-animation:change linear 1.2s infinite;
-o-animation:change linear 1.2s infinite;
@keyframes change {
0% { transform: scale(1,1);}
50% {transform: scale(0.8,0.8);}
100% {transform: scale(1,1);}
}
@-moz-keyframes change {
0% { transform: scale(1,1);}
50% {transform: scale(0.8,0.8);}
100% {transform: scale(1,1);}
}
@-webkit-keyframes change {
0% { transform: scale(1,1);}
50% {transform: scale(0.8,0.8);}
100% {transform: scale(1,1);}
}
@-o-keyframes change {
0% { transform: scale(1,1);}
50% {transform: scale(0.8,0.8);}
100% {transform: scale(1,1);}
}
change:为动画名称