0

下面是我想用新功能更新的 jsfiddle.net 代码：

http://jsfiddle.net/weigruf/mKj8p/

我要添加的是当您将鼠标悬停在 .rotator .rotator-child div 上时序列暂停，以及一个小的缩略图导航，它将显示同一图像的一个小版本，您可以在它们之间导航。

此外，缩略图导航也应该具有暂停效果。

提前致谢。（：

编辑1：

我合并了代码并用 .mouseenter 更新了代码，现在序列已暂停，但是我想在 .mouseleave 上恢复序列并在光标位于 div 时再次暂停它。

请看一下：

http://jsfiddle.net/weigruf/mKj8p/

4

1 回答 1

0

无论如何，我都不是 jQuery/JS 专家，这不是一个有效的示例，但这可能有助于为您指明正确的方向。

我使用 setInterval 而不是 setTimeout。在鼠标悬停时，清除间隔，使其不再触发。在 mouseleave 上，等待 6 秒，然后运行函数 doRotate() 将再次重新启动计时器，并加载新广告。

function doRotate() {
    next();
    theInterval = setInterval(doRotate, 6000);
}

$('#myAdElement').mouseenter(function() {
   clearInterval(theInterval)
})

$('#myAdElement').mouseleave(function() {
   setTimeout(function() {
       doRotate();
   }, 6000);
})
于 2012-02-04T22:15:29.883 回答