标签:ati animation img height logs pre 动画 技术分享 over
书上偶然看到的
先上一张素材
DOM
<div class="loader"> </div>
@keyframes loader{
to{background-position: -400px 0;}
}
.loader{
margin: 0 auto;
width: 50px;
height: 50px;
background: url(img/loader.png) 0 0;
background-size: cover;
animation: loader 1.2s infinite steps(8);
}
关键点是
animation: loader 1.2s infinite steps(8);
steps分布动画,每次50px,所以看起来就像是一个加载动画,试一试
标签:ati animation img height logs pre 动画 技术分享 over
原文地址:http://www.cnblogs.com/famLiu/p/7201784.html