因为fadeIn()显示图片不是及时显示，当鼠标悬浮在按钮上迅速切换时，上一张图片有可能再鼠标悬浮在下一个按钮上时再显示,这时可在fadeIn()方法前使用stop(false,true)停止动画；
stop 是jQuery中用于控制页面动画效果的方法。运行之后立刻结束当前页面上的动画效果。
stop在新版jQuery中添加了2个参数：
第一个参数的意思是是否清空动画序列，也就是stop的是当前元素的动画效果还是停止后面附带的所有动画效果，一般为false，跳过当前动画效果，执行下一个动画效果；
第二个参数是是否将当前动画效果执行到最后，意思就是停止当前动画的时候动画效果刚刚执行了一般，这个时候想要的是动画执行之后的效果，那么这个参数就为true。否则动画效果就会停在stop执行的时候
stop(false)：不停止被选元素所有加入队列的动画，仅停止当前的动画。
stop(true)：停止所有加入队列的动画。
stop(false,true)：直接停止当前动画，并跳转至当前动画的最终末尾效果位置，接着正常执行后面的动画队列，直至完成整个动画。
html
<div>
<img src="" alt="">
<img src="" alt="">
<img src="" alt="">
</div>
<div>
<img src="" alt="">
<img src="" alt="'>
<img src="' alt="">
</div>
script
$(function(){
$(".dot a").hover(function(){
showBanner($(this).index());
stopAm();
},function(){
startAm();
});
var currentindex = 0;
var timerID = null ;
function showBanner(i){
currentindex = i ;
$(".banner img:eq("+i+")").stop(false,true).fadeIn().siblings('img').hide();
$(".dot a:eq("+i+") img").attr('src',"/{$_CLIENT}/images1/dot_on.png");
$(".dot a:eq("+i+")").siblings().find('img').attr('src',"/{$_CLIENT}/images1/dot.png");
}
function startAm(){
if(timerID){
return;
}
timerID = setInterval(timer_tick,3000);
}
function stopAm(){
if(timerID){
clearInterval(timerID);
timerID = null;
}
}
function timer_tick(){
totalNum = $('.dot a').length;
currentindex = currentindex
}
startAm();
})
