6

我正在使用niceScroll jQuery 插件来替换溢出中的常见浏览器滚动条<div>'s。该插件运行良好，但我无法让它工作并始终显示滚动条（即使内容没有超出<div>界限）。我的最终配置是：

$(document).ready(function () {
    $(".div-wrapper").niceScroll({
        cursorcolor: "#333",
        cursoropacitymin: 0.3,
        background: "#bbb",
        cursorborder: "0",
        autohidemode: false,
        cursorminheight: 30
    });
};

我试过开火$(".div-wrapper").getNiceScroll().show()，但它似乎也不起作用。

任何帮助将不胜感激，谢谢

4

5 回答 5

9

首先，你最后少了一个括号——这可能是你的问题吗？

将 autohidemode 设置为 false 仅意味着它不会在用户停止滚动时消失，然后在滚动时再次出现。不幸的是，如果内容没有溢出，这并不意味着它是可见的。

作为一种解决方法，您可以尝试在调用 .niceScroll() 后使 id=ascrail2000 的元素显式可见，如下所示：

$(document).ready(function () {
    $(".div-wrapper").niceScroll({
        cursorcolor: "#333",
        cursoropacitymin: 0.3,
        background: "#bbb",
        cursorborder: "0",
        autohidemode: false,
        cursorminheight: 30
    });
    $('#ascrail2000').show();
});

在最后一行中查看缺失的括号

您可能还需要使其子元素可见：

    $('#ascrail2000 *').show();

（确保元素的 id 是 ascrail2000 在您的情况下。）

更新：正如 veritas 所指出的，使用更通用的选择器div[id^='ascrail']而不是#ascrail2000使它适用于一页上的多个 nicescroll，因此可以使用 JavaScript 完成上述操作：

    $("div[id^='ascrail']").show();

或在 CSS 中：

    div[id^='ascrail'] { display: block; }

或者如果上述方法不起作用：

    div[id^='ascrail'] { display: block !important; }

这不是最优雅的解决方案，但恐怕这是目前解决此问题的唯一方法，因为 nicescroll 插件没有选择该行为的选项。幸运的是，nicescroll 是开源的，可以在 GitHub 上使用，因此人们可以轻松地对其进行分叉并添加这样的选项或在 GitHub 上发布功能请求。

于 2012-07-24T14:00:22.913 回答
6 
$(".div-wrapper").niceScroll({
    cursorcolor: "#333",
    cursoropacitymin: 0.3,
    background: "#bbb",
    cursorborder: "0",
    autohidemode: false,
    cursorminheight: 30
});
于 2012-11-02T16:12:05.063 回答
0

我假设如果内容没有溢出边界框， niceScroll 不会做任何事情，这可能是你的问题。请记住 niceScroll 不是 >$overflow: scroll;... 如果不深入研究插件本身，我无法确定，但我会假设它内置了一个检查来测试内容是否需要滚动，以及是否需要滚动它没有，然后函数静默退出。

于 2012-07-24T10:53:20.950 回答
0

现在07/02/2018和工作版本jquery.nicescroll v3.7.6 源链接

添加后 autohidemode: false 对我来说效果很好。

$("#example").niceScroll({
   autohidemode: false       // it make nicescroll scroll bar visible all time
});
于 2018-07-02T15:30:00.847 回答
0

我通过谷歌搜索看到了这个答案，即使它很旧，如果有人看到这个寻求答案，这就是我的工作解决方案：

        $('#ascrail2000.nicescroll-rails').show();
        $('#ascrail2000.nicescroll-rails div').height('300px').show();

我需要为“bar” div 设置任意高度，因为默认情况下它是 height:0px，即使你显示它，你也看不到任何东西。我想我们可以做得更好，用窗户尺寸计算一个好的高度，但我不需要:)

于 2017-02-07T15:04:22.267 回答