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 婆婆高寿祝福语大全简短