0

我在使用 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");
});
4

3 回答 3

2

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

// 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

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

祝你好运！

于 2012-03-27T06:12:10.037 回答
0

我相信也许不同的版本会影响行为也很重要。这适用于我的：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");
    });
});
于 2013-03-27T19:14:12.077 回答
0

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

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

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

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

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

于 2012-03-27T15:00:39.247 回答