动画渐变兼容各个浏览器

.destination1 .current{
display:block;
animation:danru 2s linear infinite;
-webkit-animation:danru 2s linear alternate ;
-moz-animation:danru 2s linear alternate ;
-o-animation:danru 2s linear alternate ;

}
@keyframes danru{
0% {opacity:0.00;left:0px; top:0px;}
25% {opacity:0.25;left:50px; top:0px;}
50% {opacity:0.50;left:100px; top:0px;}
75% {opacity:0.75;left:150px; top:0px;}
100% {opacity:1.0; left:200px; top:0px;}
}

@-webkit-keyframes danru{
0% {opacity:0.00;left:0px; top:0px;}
25% {opacity:0.25;left:50px; top:0px;}
50% {opacity:0.50;left:100px; top:0px;}
75% {opacity:0.75;left:150px; top:0px;}
100% {opacity:1.0; left:200px; top:0px;}
}
@-moz-keyframes danru{
0% {opacity:0.00;left:0px; top:0px;}
25% {opacity:0.25;left:50px; top:0px;}
50% {opacity:0.50;left:100px; top:0px;}
75% {opacity:0.75;left:150px; top:0px;}
100% {opacity:1.0; left:200px; top:0px;}
}
@-o-keyframes danru{
0% {opacity:0.00;left:0px; top:0px;}
25% {opacity:0.25;left:50px; top:0px;}
50% {opacity:0.50;left:100px; top:0px;}
75% {opacity:0.75;left:150px; top:0px;}
100% {opacity:1.0; left:200px; top:0px;}
}

动画渐变兼容各个浏览器,布布扣,bubuko.com

动画渐变兼容各个浏览器

原文：http://www.cnblogs.com/hgj123/p/3759501.html