暂停悬停功能

2012-12-02 226 views 0 likes

我有一个用JavaScript编写的函数，它允许我滚动以特定间隔迭代的图像数组，现在我想通过在鼠标悬停在任何位置时暂停旋转来添加更多功能数组中的图像。暂停悬停功能

的Javascript

(function() { 
    var rotator = document.getElementById('bigImage'); 
    var imageDir = '../images/headers/'; 
    var delayInSeconds = 5; 
    var images = ['ImageOne.png', 'ImageTwo.png', 'ImageThree.png', 'ImageFour.png', 
     'ImageFive.png', 
     'ImageSix.png']; 
    var num = 0; 
    var changeImage = function() { 
     var len = images.length; 
     bigImage.src = imageDir + images[num++]; 
     if (num == len) { 
      num = 0; 
     } 
    }; 
    setInterval(changeImage, delayInSeconds * 1000); 

})();

来源

2012-12-02 Dino Excel

是哪一个'rotator'或'bigImage'！？ – Alexander

回答

使用jQuery：

var rotationRunning = true; 

var changeImage = function() { 
    if (rotationRunning) { 
     var len = images.length; 
     rotator.src = imageDir + images[num++]; 
     if (num == len) 
      num = 0; 
     } 
    } 
}; 

$(rotator).hover(
    function() { rotationRunning = false; }, 
    function() { rotationRunning = true; } 
);

来源

2012-12-02 15:37:38 Namek

你可以使用我的默认代码吗？ –

看到亚历山大的问题。我假定bigImage变量和旋转变量相同。 – Namek

你可以存储从setInterval的返回的ID，并在图像悬停在它传递给clearInterval。

因此，在鼠标悬停后，您可以清除，并在鼠标悬停后重新设置。

希望有帮助！

来源

2012-12-02 15:33:26 Jimadilo

暂停悬停功能

回答

相关问题