Question

我在使用jquery插件smoothdivscroll时遇到了一些问题。

基本上，我正在尝试将插件作为此页面运行：http://www.smoothdivscroll.com/demo.html

但是，我已经更改了javascript，因为需要自动滚动但允许热点也能正常工作，但是还原为自动滚动鼠标离开热点。

虽然下面的代码有效，但是在你将触发器放在右边后，它会'重置'回到第一个div。

有没有办法将它设置为从设定位置继续滚动？

代码：

    // Initialize the plugin with no custom options
    $(document).ready(function () {
        // I just set some of the options
        $("div#makeMeScrollable").smoothDivScroll({
        mousewheelScrolling: true,
        visibleHotSpotBackgrounds: "always",
        autoScrollingMode: "endlessright"
        });


    });
    //This is just to make the scroller pause...
    $("#makeMeScrollable").bind("mouseover", function() {
    $(this).smoothDivScroll("stopAutoScrolling");
    }).bind("mouseout", function() {
    $(this).smoothDivScroll("startAutoScrolling");
});

Answer 1

我不知道这是否是导致您出现问题的原因，但您需要注意括号。将代码更改为：

// jQuery document ready
$(document).ready(function () {
  // Initialize the scroller
  $("#makeMeScrollable").smoothDivScroll({
    mousewheelScrolling: true,
    visibleHotSpotBackgrounds: "always",
    autoScrollingMode: "endlessright"
  });

  //This is just to make the scroller pause...
  $("#makeMeScrollable").bind("mouseover", function() {
    $(this).smoothDivScroll("stopAutoScrolling");
    }).bind("mouseout", function() {
    $(this).smoothDivScroll("startAutoScrolling");
  });
}); // End query document ready

我没有测试过这段代码，但除非我输错了，否则这是正确的方法。

祝你好运！

Answer 2

我看到选项不对。试试这个（如果您使用的是最新版本，即版本1.2）：

  // Initialize the scroller
  $("#makeMeScrollable").smoothDivScroll({
    mousewheelScrolling: true,
    visibleHotSpotBackgrounds: "always",
    autoScrollingMode: "onstart",
    autoScrollingDirection: "endlessloopright",
    manualContinuousScrolling: true
  });

在此配置中，滚动条将在加载时立即自动滚动到无缝循环中。一旦用户使用鼠标滚轮或热点，自动滚动将停止，如果不是您的自定义事件处理程序，它将不会再次启动自动滚动。但是既然你拥有它们，它应该在用户离开可分割区域时再次启动。

我还将manualContinuousScrolling设置为true，以便在手动滚动时获得相同的无限循环。

尚未经过测试，因此您可能需要进行一些调整。例如，我不确定autoScrollingMode：“onstart”或autoScrollingMode：“always”是否是最佳选择。你只需要尝试。

Answer 3

我认为也许重要的是，不同的版本可能会影响行为。这适用于我的：jquery.smoothDivScroll-1.1-min.js版本。

注意函数名称的区别：stopAutoScroll与stopAutoScrolling等。

$(window).load(function() {
    $("#makeMeScrollable").smoothDivScroll({ 
        autoScroll: "always", 
        autoScrollDirection: "backandforth", 
        autoScrollStep: 1, 
        autoScrollInterval: 25, 
        startAtElementId: "startAtMe"
    });

    //This is just to make the scroller pause...
    $("#makeMeScrollable").bind("mouseover", function() {
        $(this).smoothDivScroll("stopAutoScroll");
        }).bind("mouseout", function() {
        $(this).smoothDivScroll("startAutoScroll");
    });
});

Smooth Div Scroll - Scroll Right在鼠标关闭时重置

3 个答案: