javascript - smoothdivscroll - 仅在点击时滚动

Question

我正在使用 smootdivscroll 在网站上显示产品。产品全部加载到一个大 div 中，然后使用 smootdivscroll 脚本左右滚动。我在左右两侧设置了在悬停或单击时滚动的箭头。

我想禁用鼠标悬停滚动，只允许在单击箭头时滚动。

实际页面

Smoothdiv 滚动演示页面

问候。

Answer 1

在阅读了这方面的文档之后，如果不破解插件，它就不可能实现。热点监听悬停和点击，你不能在没有另一个的情况下禁用一个。

破解的地方，如果你选择（不建议）在这里https://github.com/tkahn/Smooth-Div-Scroll/blob/master/js/jquery.smoothDivScroll-1.3.js#L195

您将需要删除除mousedown和mouseup侦听器之外的所有内容。

Answer 2

我认为它没有内置该功能。但是，您可能可以使用此公共方法：http ://www.smoothdivscroll.com/publicMethods.html#move

在选项中禁用并将一些单击事件侦听器绑定到将触发该方法hotSpotScrolling的那些箭头。move()

Answer 3

感谢您的帮助和想法，以下是我的解决方案。

首先禁用热点和热点滚动：

visibleHotSpotBackgrounds: "",
hotSpotScrolling: false

我创建了两个链接，后来更新为控制滚动的箭头图像：

<a title="Scroll Left" href="#" onclick="MoveLeft();return false;">LEFT</a>
<a title="Scroll Right" href="#" onclick="MoveRight();return false;">RIGHT</a>

使用两个简单的函数将滚动前进 +- 200px

<script type="text/javascript">
    function MoveRight() {
        $("#makeMeScrollable").smoothDivScroll("move", 200);
    }
    function MoveLeft() {
        $("#makeMeScrollable").smoothDivScroll("move", -200);
    }
</script>

平滑滚动效果集：

easingAfterMouseWheelScrolling: true