jCarouselLite:在悬停时暂停滚动

Question

我正在使用jCarouselLite，一切运行正常。但是，我希望一旦我悬停在旋转木马上，自动滚动就会暂停。

jCarouselLite文档说我可以使用这个：

$('div.carousel').trigger('pauseCarousel')

但我对jQuery了解不多。如何在以下代码中实现暂停功能？

<script>
jQuery(function() { 
    jQuery(".carousel").jCarouselLite({
        auto: 3000,
        speed: 1000,
        visible: 1,
        circular: true,
        autoWidth: true,
        responsive: true,
        vertical: true
   });
});
</script>

谢谢

Answer 1

您可以将jQuery.mouseover()函数链接到jCarouselLite对象实例化，如下所示：

$('div.carousel').jCarouselLite({
  btnNext: '.next',
  btnPrev: '.prev',
  auto: 3,
  speed: 500
}).mouseover(function(){
  $(this).trigger('pauseCarousel');
});

可在此fiddle上获得现场演示。当您将鼠标悬停在旋转木马上时，水平滚动将暂停。鼠标离开时，滚动将自动恢复。