Bootstrap的Refresh Icon也spin起来
bootstrap下面有个glyphicon-refresh,但是不会自定动态spin[旋转],下面提供下我的实例
.spin{
-webkit-transform-origin:50%50%;
transform-origin:50%50%;
-ms-transform-origin:50%50%;/*IE9*/
-webkit-animation:spin.8sinfinitelinear;
-moz-animation:spin.8sinfinitelinear;
-o-animation:spin.8sinfinitelinear;
animation:spin.8sinfinitelinear;
}
@-webkit-keyframesspin{
0%{
-webkit-transform:rotate(0deg);
transform:rotate(0deg);
}
100%{
-webkit-transform:rotate(359deg);
transform:rotate(359deg);
}
}
@keyframesspin{
0%{
-webkit-transform:rotate(0deg);
transform:rotate(0deg);
}
100%{
-webkit-transform:rotate(359deg);
transform:rotate(359deg);
}
}
调用方式如下
<spanclass="glyphiconglyphicon-refreshloadingspin"></span>
以上所述是小编给大家介绍的Bootstrap的RefreshIcon也spin起来,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对毛票票网站的支持!
热门推荐
10 分别祝福语简短情话英文
11 亲人喜得贵子祝福语简短
12 要庆祝生日祝福语简短
13 关于健康的祝福语简短
14 对战友的祝福语简短
15 送给妈妈新年祝福语简短
16 手写妈妈生日祝福语简短
17 作文老师寄语简短祝福语
18 节日结束祝福语简短的