Jquery 鼠标悬停时在屏幕上闪烁图像

我需要在鼠标悬停在图像上时闪烁图像，并在鼠标离开后停止闪烁。但是“flash_imgs”总是被称为鼠标移动到div上

如果我使用两个按钮（#开始，#停止）和.click（）-一切正常。但我只需要“mouseover”和“mouseout”

HTML:

---

谢谢

鼠标悬停可能是错误的事件。每次你移动鼠标，它都会重新触发，你会建立一个队列。所以第一件事是交换

mouseenter

和

mouseleave

接下来，您只需要清除mouseout上的间隔，这意味着它不可能立即停止。我相信jQuery有一个

.stop（）

函数，可以用于动画，但我想我会把这部分留给您。。。因为我觉得内容很脏。；-）

---

鼠标悬停可能是错误的事件。每次你移动鼠标，它都会重新触发，你会建立一个队列。所以第一件事是交换

mouseenter

和

mouseleave

接下来，您只需要清除mouseout上的间隔，这意味着它不可能立即停止。我相信jQuery有一个

.stop（）

函数，可以用于动画，但我想我会把这部分留给您。。。因为我觉得内容很脏。；-）

---

我需要闪光图像。等一下，我需要闪一下图像。等一下，故事证实了。这里的癫痫发作稍微轻一点-多谢了）我让它不闪烁，但有很多变化的图像）故事证实了这一点。这里的癫痫发作稍微轻一点-非常感谢）我不闪烁，但有很多变化的图像）

<div class="container">
    <img src="img1.gif" alt="" class="slide">
    <img src="img2.gif" alt="" class="slide">
    <img src="img3.gif" alt="" class="slide">
    <img src="img4.gif" alt="" class="slide">
</div> 

<style type="text/css">
    img { position: absolute;   width: 600px; height: 300px;}
    div.container { border: 1px solid red;  width: 600px; height: 300px; }
</style>

(function() {
    var enable = null,
        container = $('div.container'),
        imgs = container.find('img'),
        timeInOut = 1000,
        intervalTime = imgs.length * timeInOut;

    imgs.each( function( ){
        $(this).hide();
    });

    function flash_imgs( images, time ){
        images.each( function( i ){
            $(this).delay( time * i ).fadeIn( time / 2 ).fadeOut( time / 2 );
        });
    }

    container.on('mouseover', function(){
        flash_imgs( imgs, timeInOut );
        enable = setInterval(flash_imgs, intervalTime, imgs, timeInOut);
    });

    container.on('mouseout', function(){
        clearInterval(enable);
    });
})();

container.on('mouseenter', function(){
    flash_imgs( imgs, timeInOut );
    enable = setInterval(flash_imgs, intervalTime, imgs, timeInOut);
});

container.on('mouseleave', function(){
    clearInterval(enable);
});