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 生日广州男生祝福语简短