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 给老师新年祝福语 简短