CSS3，JS可用于刷新按钮或者加载动画的动画
Posted ruoyuting
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了CSS3，JS可用于刷新按钮或者加载动画的动画相关的知识，希望对你有一定的参考价值。
html：
<input type="button" id="zidong3" style="top: 12px;" />
css:
#zidong3
{
position: absolute;
top: 7px;
right: 7px;
width: 24px;
height: 24px;
border: none;
background: #fff url(../images/refresh.png) no-repeat;
background-size: 100% 100%;
/*background-position: -1px 5px;*/
border-radius: 50%;
}
/*重点：*/
@-webkit-keyframes gira {
from{-webkit-transform: rotate(0deg);}
to{-webkit-transform: rotate(360deg);}
}
@keyframes gira {
from{-webkit-transform: rotate(0deg); transform: rotate(0deg)}
to{-webkit-transform: rotate(360deg); transform: rotate(360deg)}
}
JS：
$("#zidong3").click(function () {
$(this).css("-webkit-animation", "gira 1s ease-out 1");
$(this).css("-ms-animation", "gira 1s ease-out 1");
$(this).css("animation", "gira 1s ease-out 1");
var z = $(this);
setTimeout(function () {
$(z).css("animation", "");
}, 1000);
//getGPS();//获取位置
});
有时间说明
以上是关于CSS3，JS可用于刷新按钮或者加载动画的动画的主要内容，如果未能解决你的问题，请参考以下文章