如何为smoothDivScroll制作按钮

Question

我想使用标签制作2个简单的可点击链接，使用Thomas Kahn的JQuery SmoothDivScroll更改幻灯片的滚动方向。我想将滚动方向设置为RIGHT和LEFT两者都是可点击链接，但不知道如何执行此操作。有人可以帮忙吗？

到目前为止我的代码是http://www.festifood.nl/test.html

谢谢

Answer 1

以下是一种代码：

 <script type="text/javascript">
        $(document).ready(function() {
            $("#makeMeScrollable").smoothDivScroll({ 
                mousewheelScrolling: true,
                manualContinuousScrolling: true,
                visibleHotSpotBackgrounds: "always",
                autoScrollingMode: "onstart"
            });
        });
    </script>

此链接下方显示了该代码的外观以及如何编写代码：

http://www.smoothdivscroll.com/

Answer 2

以下是它的工作原理。在“$（document）.ready（function（）{” - 函数add：

的末尾

$("#right").click(function() {
  $("#makeMeScrollable").smoothDivScroll("option","autoScrollDirection","right");
});

$("#left").click(function() {
  $("#makeMeScrollable").smoothDivScroll("option","autoScrollDirection","left");    
});

$("#backandforth").click(function() {
  $("#makeMeScrollable").smoothDivScroll("option","autoScrollDirection","backandforth");    
});

好的，这是做什么的？

1. 您将ID定义为“左”，“右”等等（例如<span id="left">left</span>）。在jQuery中，您可以通过选择器选择它们，该选择器是一个描述要选择内容的字符串。要按ID选择元素，字符串以“＃”开头，​​后跟ID。要执行选择器，请使用$（选择器）作为$（“＃left”），选择带有id =“left”的＆lt; span＆gt; -Tag;
2. 我们希望将click事件的处理函数分配给此选定元素。所以我们写$("#left").click( ... );。并且作为参数我们放入一个没有参数的函数，这将在＆lt; span＆gt;时执行。被点击。
3. 在该事件处理函数中，我们更改了smoothDivScroll的选项。

更多信息

• 这里解释了选项：http://www.smoothdivscroll.com/options.html
• 此处解释了如何更改选项：http://www.smoothdivscroll.com/alteringOptions.html

点击与OnMouseOver

如果您想对鼠标悬停事件做出反应，只需写下.mouseover(...)而不是.click(...)

此外：您的CSS中的错误？

您还应修复CSS，添加“;”落后330px;和一个“浮动：离开;”：

#makemescrollable {
  position: relative;
  width: 100%;
  height: 330px;
  float: left;
}