Javascript 使用jQuery淡入/淡出并暂停鼠标

我已经编写了一个快速jQuery代码片段，可以按照预设的间隔自动淡入/淡出一组div。我的代码如下所示：

HTML

当用户鼠标悬停在#容器中的一个元素上时，是否可能暂停此效果？我做了几次尝试，但都没有成功

任何帮助都将不胜感激

这应该有效：

function InOut(elem)
{
elem.delay()
 .fadeIn(600)
 .delay(500)
 .fadeOut(600,
     function(){
        if(elem.next().length > 0) 
          { InOut(elem.next()); }
        else
          { InOut(elem.siblings(':first')); }

      }
    )
  .mouseover(function(){
        $(this).stop(true, false);
    })
  .mouseout(function(){
        InOut($(this));
    });
}

$('#container div').hide();
InOut($('#container div:first'));

这应该起作用：

function InOut(elem)
{
elem.delay()
 .fadeIn(600)
 .delay(500)
 .fadeOut(600,
     function(){
        if(elem.next().length > 0) 
          { InOut(elem.next()); }
        else
          { InOut(elem.siblings(':first')); }

      }
    )
  .mouseover(function(){
        $(this).stop(true, false);
    })
  .mouseout(function(){
        InOut($(this));
    });
}

$('#container div').hide();
InOut($('#container div:first'));

---

谢谢你的回复！似乎在第一个鼠标盖上工作，然后在随后的鼠标盖上，div元素开始相互堆叠并随机淡入/淡出。有什么想法吗？看看吧：最终导致多个div出现。感谢您的回复！似乎在第一个鼠标盖上工作，然后在随后的鼠标盖上，div元素开始相互堆叠并随机淡入/淡出。有什么想法吗？看看吧：最终会导致多个div出现。

function InOut(elem)
{
elem.delay()
 .fadeIn(600)
 .delay(500)
 .fadeOut(600,
     function(){
        if(elem.next().length > 0) 
          { InOut(elem.next()); }
        else
          { InOut(elem.siblings(':first')); }

      }
    )
  .mouseover(function(){
        $(this).stop(true, false);
    })
  .mouseout(function(){
        InOut($(this));
    });
}

$('#container div').hide();
InOut($('#container div:first'));