在javascript中停止幻灯片

Question

我在项目中使用了这个视差滑块http://codepen.io/suez/pen/ByvKXE。

然后我在页面顶部添加了一个悬停菜单。

<ul class="menu">
    <li class="list-menu fa-home"></li>
    <li class="list-menu fa-suitcase"></li>
    <li class="list-menu fa-flask"></li>
    <li class="list-menu fa-user"></li>
    <li class="list-menu fa-contact"></li>
</ul>

当我将鼠标放在菜单上点击按钮时，我想停止视差滑块。

我怎么能这样做？

感谢您的回答。

Answer 1

看看http://codepen.io/anon/pen/YwGjNd。我做了以下更改。

stopAutoSlide：允许或阻止自动滑动的变量

mouseenter，mouseleave：要更改stopaAutoSlide州的事件

if (!stopAutoSlide)：仅在stopAutoSlide为false时更改当前幻灯片。

我希望这会有所帮助。

$(document).on("mouseenter", ".slider-pagi", function() {
  stopAutoSlide = true;
});

$(document).on("mouseleave", ".slider-pagi", function() {
  stopAutoSlide = false;
});