始终显示niceScroll导轨 [英] Always display niceScroll rail

问题描述

我正在使用 niceScroll jQuery插件替换溢出的常见浏览器滚动条< DIV>的。该插件运行良好，但我无法使其工作并显示滚动轨道始终（即使内容不超过< div> bounds）。我的最终配置是：

I'm using niceScroll jQuery plugin to replace common browser scrollbars in overflowing <div>'s. The plugin is working good, but I can't get it to work and display the scroll rail always (even if the content is not exceeding <div> bounds). My final configuration is:

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

我试图解雇 $（。div-wrapper）。getNiceScroll（）。show（）但它似乎也没有用。

I've tried to fire $(".div-wrapper").getNiceScroll().show() but it doesn't seem to work either.

感谢任何帮助，谢谢

推荐答案

首先，你有最后一个缺失的括号 - 这可能是你的问题吗？

First of all, you have a missing parenthesis at the end - could that be your problem?

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

Setting autohidemode to false only means that it doesn't disappear when the user stops scrolling and then appear again while scrolling. Unfortunately it doesn't mean it's visible if the content doesn't overflow.

作为一种解决方法，你可以尝试制作日调用.niceScroll（）后，id = ascrail2000的e元素显式可见：

As a workaround you may try making the element with id=ascrail2000 explicitly visible after your call to .niceScroll() with something like this:

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

查看最后一行中遗失的部分

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

You may need to make its children elements visible as well:

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

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

(Make sure that the element's id is ascrail2000 in your case.)

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

UPDATE: as veritas has pointed out, using a more general selector div[id^='ascrail'] instead of #ascrail2000 makes it work for more than one nicescroll on one page, so the above can be done with JavaScript:

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

或在CSS中：

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

或如果以上情况不起作用：

or if the above doesn't work:

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

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

This is not the most elegant solution but I'm afraid this is currently the only way to solve this problem because the nicescroll plugin doesn't have an option to select that behaviour. Fortunately nicescroll is open source and available on GitHub so one could easily fork it and add such an option or post a feature request on GitHub.

这篇关于始终显示niceScroll导轨的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！