Question

我一直试图弄清楚如何在鼠标悬停时暂停此功能，并继续鼠标移除。我已经想出如何在鼠标悬停时暂停该功能，但它不会在mouseout上再次启动。这是jQuery代码（从另一个教程中使用）。

function swapImages(){  
 var $active = $('#myGallery .active');    
var $next = ($('#myGallery .active').next().length > 0) ? $('#myGallery .active').next() : $('#myGallery img:first');  
 $active.fadeOut(function(){     
$active.removeClass('active');      
$next.fadeIn().addClass('active'); }); }  

 $(document).ready(function(){setInterval('swapImages()', 5000);}  
 $('#myGallery').mouseover(function(){ 
 $(this).delay(60000);
});

Answer 1

使用jQuery的hover

$( selector ).hover( handlerIn, handlerOut )

的缩写

$( selector ).mouseenter( handlerIn ).mouseleave( handlerOut );

Answer 2

您必须保存对setinterval()的引用。在鼠标悬停时，您清除间隔，从而停止幻灯片放映。在下面的例子中，我冒昧地重新启动鼠标悬停。可以更轻松地完成，但这解释得更好。

var slideshow;
$(document).ready(function(){
    slideshow = setInterval( swapImages, 5000);


    $('#myGallery')
        .mouseover(function(){ clearInterval( slideshow ) })
        .mouseout(function(){ slideshow = setInterval( swapImages, 5000); });
});

Answer 3

我猜您要求的内容如下：

$('#hello').mouseout(function() {
    /*script to execute*/
});

如何为此jquery函数添加暂停？

3 个答案:

Demo