日期:2014-05-16 浏览次数:20310 次
$(document).ready(function() { $(".aa").hover( function() { picTimer = setInterval(function() {showPic();},500); //此3000代表自动播放的间隔,单位:毫秒 } ,function(){ clearInterval(picTimer); } ).trigger("mouseleave"); function showPic() { $(".div1").animate({"left":"300"},500); } });
.divaa{ width:300px; height:250px; background:#FFCC99} .div1{ position:absolute; top:0px; left:400px;}
<a href="#" class="aa">click me</a> <div class="div1 divaa">1</div>
<!DOCTYPE HTML> <html> <head> <meta charset="gb2312" /> <title></title> <style> div { width:40px; height:40px; border:1px solid red; } </style> <script src="http://code.jquery.com/jquery-latest.js"></script> </head> <body> <div id="a"></div> <button id="btn">动画/停止</button> <script> var timer; var a = $('#a'); $('#btn').click(function(){ if(timer){ clearInterval(timer); timer = null; return; } clearInterval(timer); timer = setInterval(function(){ a.animate({ marginLeft: parseInt(a.css('marginLeft')) + 11 }) }, 500) }) </script> </body> </html>