jquery setInterva 求指点，hover执行，mouseout终止。求指点

就是想鼠标移上去就每500毫秒移动，mouseout时终止。 求指点，我写的好像实现不了，求指点
$(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>

解决方案 »

  1.   

    $(".div1").animate({"left":"300"},500);
    300写死了，移动到了肯定就不再动了。
      

  2.   

    $(".div1").animate({"left": parseInt($(".div1").css('left')) - 10}, 500);
      

  3.   

    移动了，mouseout怎么办？
    楼主看看
    <!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>