2014-11-06 71 views
1

jQuery的周期照片我已经成功地实现当鼠标悬停一个div循环和周期改变background-image和停止其他divs在DIV背景

会发生什么事是,这div有当鼠标悬停在div出现一个标题,如果我抢光标,并在标题,然后再次将光标移动到其他div称号,周期继续在两个divs,我不想。

我清除interval cycle这样:clearInterval(theInterval);

但是,不知何故,当标题被徘徊它不会停止其他循环。

问题可以在JSFiddle中看到。

模拟问题:

  1. 将光标放在标题
  2. 快速将光标移动到其他分区冠军
  3. 你会看到两个div的继续独立于周期(和我只想要一个循环)

模拟它是如何工作的:

  1. 将光标放在股利(没有在标题为)
  2. 将光标移动到其他分区
  3. 你会看到只有一个DIV周期
+0

替换 '鼠标悬停' 与 '的mouseenter' 和 '鼠标移开' 与 '鼠标离开'。该代码也将简化 - [小提琴](http://jsfiddle.net/g9d16b2L/) – 2014-11-07 00:58:28

回答

0

我相信这是这个事件的性质有问题,而且divs非常接近。尝试使用悬停事件。见this fiddle

本质:

$('.collection-photo').hover(function(){ 
    // mouse over stuff here 
}, function() { 
    // mouse out stuff here 
}); 
+0

正确的解决方案,错误的分析。 '.hover()'工作,因为它等价于'$(selector).mouseenter(handlerIn).mouseleave(handlerOut)'; – 2014-11-07 01:02:05

+0

所以你说'hover()',它是'mouseenter'和'mouseleave',行为不同于'mouseover'?那不是我所说的 - 它的性质是不同的? – elzi 2014-11-07 01:07:06

+0

对不起,我应该更具体。这是“我非常接近”,我不同意。我不认为这是相关的。这与'mouseleave'比'mouseout'更可靠。 – 2014-11-07 01:23:42