最近无事，看到网易新闻的聚合版块，有个刷新按钮，于是也试着仿了下来，现分享代码：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <Meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>仿网易聚合新闻 - 刷新按钮旋转效果</title> <script src="js/jquery-1.7.2.js"></script> <script type="text/javascript"> $(function(){ var deg = 0; $("a").click(function(){ deg = deg+360; $(this).css("transform","rotate("+deg+"deg)"); $(this).css("-o-transform","rotate("+deg+"deg)"); $(this).css("-webkit-transform","rotate("+deg+"deg)"); }); }); </script> <style> div { background: url("images/refresh.png") no-repeat scroll 0 0 rgba(0,0); position:relative; opacity: 0.7; width:50px; height:50px; } a { background: url("images/refresh.png") no-repeat scroll -50px 0 rgba(0,0); display:block; width:38px; height:36px; cursor: pointer; position:absolute; left:6px; top:8px; transition:transform 0.8s linear 0s; -o-transition:-o-transform 0.8s linear 0s; -webkit-transition:-webkit-transform 0.8s linear 0s; } </style> </head> <body> <div> <a target="_self" ></a> </div> </body> </html>
这是refresh.png图片，jquery大家可以自行下载。
文件包下载：http://pan.baidu.com/share/link?shareid=3224596422&uk=2769120659
原文链接：https://www.f2er.com/javaschema/285966.html