网页图片特效:鼠标悬停暂停播放鼠标移开继续播放

<div class="banner">
                         <ul class="IMG_list">
                                  <li><a target="_blank"><img src="images/1.jpg" alt="帆布鞋"></a><div class="titDiv"><p class="opacity">帆布鞋</p></div></li>
                                  <li><a target="_blank"><img src="images/2.jpg" alt="针织衫"></a><div class="titDiv"><p class="opacity">针织衫</p></div></li>
                                  <li><a target="_blank"><img src="images/3.jpg" alt="户外"></a><div class="titDiv"><p class="opacity">户外</p></div></li>
                                  <li><a target="_blank"><img src="images/4.jpg" alt="外套"></a><div class="titDiv"><p class="opacity">外套</p></div></li>
                                  <li><a target="_blank"><img src="images/5.jpg" alt="衬衫"></a><div class="titDiv"><p class="opacity">衬衫</p></div> </li>
                         </ul>
                <p class="play_count">
                                        <span class="on_count">1</span>
                                        <span>2</span>
                                        <span>3</span>
                                        <span>4</span>
                                        <span>5</span>
                        </p>
           
</div>

JS部分：

var  timer=null
function showAuto(){
        var count=$("#focus_n li").length;
    n = n >= (count - 1) ? 0 : n + 1;  
    $("#focus_n li").eq(n).trigger('mouseover');  
}

var t = n = count = 0;
$(function(){  
    $("#focus_m li:not(:first-child)").hide();  
    $("#focus_n li").mouseover(function(){
                $(this).addClass('active').siblings().removeClass('active');
                count = $(this).parents().find('#focus_m li').length;
        var i=$(this).parent().find('li').index(this);
                 n = i;
                 if (i >= count) return;
                 $(this).parents().find('#focus_m li').stop(false,true).filter(":visible").fadeOut().parent().children().eq(i).fadeIn();  
    }); 
       
         window.timer = setInterval("showAuto()", 5000);
        
         /*$(".banner").click(function(){
                 clearInterval(timer)},
                 function(){timer = setInterval("showAuto()", 5000);
         });*/  //这个是错的，因为鼠标点击之后，5秒之后并不能实现继续滚动
        
     $('.banner').mouseover(function(){
                 clearTimeout(timer);
                 window.setTimeout(function(){timer = setInterval("showAuto()", 5000)});
         })
        
          /*$(".banner").mouseover(function(){
           clearInterval(timer);
      });
        $(".banner").mouseout(function(){
           timer = setInterval("showAuto()", 2000);
      }); */ //这个是也错的，因为鼠标点击之后，5秒之后只能滚动一次
        
        
})

鼠标悬停，暂停播放。鼠标移开继续播放。是接着当前页继续播放哦。
这个效果目前是有问题。请大家帮帮忙。