不同div.onHover上的jQuery动作

Question

我必须说我是jquery的初学者，但我通常会试着自己弄清楚并解决问题。但是现在我遇到了问题而且我被困了

我有一个jquery函数可以在div .break_rotate

中旋转图像

var divs = $('div[class^="break_rotate"]').hide(),
    i = 0;

(function cycle() { 

    divs.eq(i).fadeIn(400)
              .delay(4000)
              .fadeOut(400, cycle);

    i = ++i % divs.length;

})();

现在。当我将鼠标悬停在另一个div上时，我试图阻止此功能。例如#div2

有人可以帮助我吗？

Answer 1

添加变量以检查是否应该旋转，在事件.mouseenter和.mouseleave中设置此变量值

var allowrotate = true;

$('.break_rotate').mouseenter(function() {  
   allowrotate = false;
});

$('.break_rotate').mouseleave(function() {  
   allowrotate = true;
});

(function cycle() { 

if(allowrotate){
divs.eq(i).fadeIn(400)
          .delay(4000)
          .fadeOut(400, cycle);

i = ++i % divs.length;
}

})();