Bootstrap的Refresh Icon也spin起来
编程学习 2021-07-04 20:00www.dzhlxh.cn编程入门
本文通过实例给大家介绍Bootstrap的Refresh Icon相关知识，非常不错，具有参考借鉴价值，感兴趣的朋友一起学习吧
bootstrap狼蚁网站SEO优化有个glyphicon-refresh，但是不会自定动态spin[旋转]，狼蚁网站SEO优化提供下我的实例
.spin{
-webkit-transform-origin: 50% 50%;
transform-origin:50% 50%;
-ms-transform-origin:50% 50%; /* IE 9 */
-webkit-animation: spin .8s infinite linear;
-moz-animation: spin .8s infinite linear;
-o-animation: spin .8s infinite linear;
animation: spin .8s infinite linear;
}
@-webkit-keyframes spin {
0% {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-webkit-transform: rotate(359deg);
transform: rotate(359deg);
}
}
@keyframes spin {
0% {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-webkit-transform: rotate(359deg);
transform: rotate(359deg);
}
}
调用方式如下
<span class="glyphicon glyphicon-refresh loading spin"> </span>
以上所述是长沙网络推广给大家介绍的Bootstrap的Refresh Icon也spin起来，如果大家有任何疑问请给我留言，长沙网络推广会及时回复大家的。在此也非常感谢大家对狼蚁SEO网站的支持！
上一篇：JS基础随笔(菜鸟必看篇)
下一篇：jQuery实现div横向拖拽排序的简单实例