Javascript 始终显示 niceScroll rail
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/11628793/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Always display niceScroll rail
提问by veritas
I'm using niceScrolljQuery 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:
我正在使用niceScrolljQuery 插件来替换 overflowing 中的常见浏览器滚动条<div>'s
。该插件运行良好,但我无法让它工作并始终显示滚动条(即使内容没有超出<div>
范围)。我的最终配置是:
$(document).ready(function () {
$(".div-wrapper").niceScroll({
cursorcolor: "#333",
cursoropacitymin: 0.3,
background: "#bbb",
cursorborder: "0",
autohidemode: false,
cursorminheight: 30
});
};
I've tried to fire $(".div-wrapper").getNiceScroll().show()
but it doesn't seem to work either.
我试过开火,$(".div-wrapper").getNiceScroll().show()
但似乎也不起作用。
Any help would be appreciated, thanks
任何帮助将不胜感激,谢谢
回答by rsp
First of all, you have a missing parenthesis at the end- could that be your problem?
首先,你最后缺少一个括号——这可能是你的问题吗?
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.
将 autohidemode 设置为 false 仅意味着当用户停止滚动时它不会消失,然后在滚动时再次出现。不幸的是,如果内容没有溢出,这并不意味着它是可见的。
As a workaround you may try making the element with id=ascrail2000 explicitly visible after your call to .niceScroll() with something like this:
作为一种解决方法,您可以尝试在调用 .niceScroll() 之后使用以下内容使具有 id=ascrail2000 的元素显式可见:
$(document).ready(function () {
$(".div-wrapper").niceScroll({
cursorcolor: "#333",
cursoropacitymin: 0.3,
background: "#bbb",
cursorborder: "0",
autohidemode: false,
cursorminheight: 30
});
$('#ascrail2000').show();
});
SEE THE MISSING PAREN IN THE LAST LINE
查看最后一行中缺少的 PAREN
You may need to make its children elements visible as well:
您可能还需要使其子元素可见:
$('#ascrail2000 *').show();
(Make sure that the element's id is ascrail2000 in your case.)
(在您的情况下,请确保元素的 id 为 ascrail2000。)
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:
更新:正如 veritas 所指出的,使用更通用的选择器div[id^='ascrail']
而不是#ascrail2000
使其在一页上的多个 nicescroll 中工作,因此可以使用 JavaScript 完成上述操作:
$("div[id^='ascrail']").show();
or in CSS:
或在 CSS 中:
div[id^='ascrail'] { display: block; }
or if the above doesn't work:
或者如果上述方法不起作用:
div[id^='ascrail'] { display: block !important; }
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 GitHubso one could easily fork it and add such an option or post a feature requeston GitHub.
这不是最优雅的解决方案,但恐怕这是目前解决此问题的唯一方法,因为 nicescroll 插件没有选择该行为的选项。幸运的是,nicescroll 是开源的,可在 GitHub 上获得,因此人们可以轻松地将其分叉并添加这样的选项或在 GitHub 上发布功能请求。
回答by Ramesh
$(".div-wrapper").niceScroll({
cursorcolor: "#333",
cursoropacitymin: 0.3,
background: "#bbb",
cursorborder: "0",
autohidemode: false,
cursorminheight: 30
});
回答by djeglin
I am assuming that if the content does not overflow the bounding box, niceScroll does not do anything, which might be your problem. Keep in mind that niceScroll isn't >$overflow: scroll;... Without digging through the plugin itself I can't be certain but I would assume it has a check built-in to test whether the content needs scrolling, and if it doesn't, then the function silently exits.
我假设如果内容没有溢出边界框,niceScroll 不会做任何事情,这可能是你的问题。请记住, niceScroll 不是 >$overflow: scroll;... 没有深入研究插件本身我不能确定,但我认为它有一个内置检查来测试内容是否需要滚动,如果它没有,然后该函数静默退出。
回答by Nicolas
I see this answer with a google search, even if it's old, this is my working solution if someone see this seeking for an answer :
我通过谷歌搜索看到这个答案,即使它很旧,如果有人看到这个寻求答案,这就是我的工作解决方案:
$('#ascrail2000.nicescroll-rails').show();
$('#ascrail2000.nicescroll-rails div').height('300px').show();
I need to set an arbitrary height to the "bar" div, because by default it's height:0px, even if you display it, you can't see anything. I suppose we can do better an calculate a good height with the windows dimensions, but I don't need to :)
我需要为“bar”div 设置一个任意高度,因为默认情况下它是 height:0px,即使你显示它,你也看不到任何东西。我想我们可以做得更好,用窗户尺寸计算一个好的高度,但我不需要:)
回答by MD Ashik
Right now 07/02/2018and working Version jquery.nicescroll v3.7.6Source Link
现在07/02/2018和工作版本jquery.nicescroll v3.7.6源链接
After adding autohidemode: false
it's working fine for me.
添加后 autohidemode: false
它对我来说很好用。
$("#example").niceScroll({
autohidemode: false // it make nicescroll scroll bar visible all time
});