jquery nicescroll

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/12468082/
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

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-26 11:42:28  来源:igfitidea点击:

jquery nicescroll

jqueryjquery-pluginsnicescroll

提问by saomi

I'm using nicescroll plugin. http://areaaperta.com/nicescroll/

我正在使用 nicescroll 插件。http://areaaperta.com/nicescroll/

I have just a little doubt. When the page is loaded I can see my default scroll bar from the browser, and then the nicescroll bar it is showed. I want to apply the nicescroll bar to all the document and I have the following code

我只是有点怀疑。页面加载后,我可以从浏览器中看到默认滚动条,然后显示的是 nicescroll 条。我想将 nicescroll 栏应用于所有文档,我有以下代码

var nice = $("body").niceScroll({
        preservenativescrolling: false,
        cursorwidth: '8px',
        cursorborder: 'none',
        cursorborderradius:'0px',
        cursorcolor:"#39CCDB",
        autohidemode: false, 
        background:"#999999"
     });

If I set the autohidemode to true, I don't see the default scroll bar from the browser. But I want to make the nicescroll bar always visible.

如果我将 autohidemode 设置为 true,我将看不到浏览器中的默认滚动条。但我想让 nicescroll 栏始终可见。

Does anyone know why this is happening?? Thanks

有谁知道为什么会这样??谢谢

回答by user1979388

Maybe this might help you. It works for me.

也许这对你有帮助。这个对我有用。

<script id="twitter-wjs" src="../js/widgets.js"></script>
<script src="../js/jquery.min.js"></script>
<script src="../js/jquery.easing.1.3.js"></script>
<script src="../js/jquery.nicescroll.min.js"></script>


<script>

  // Hide Overflow of Body on DOM Ready //
$(document).ready(function(){
    $("body").css("overflow", "hidden");
});

// Show Overflow of Body when Everything has Loaded //
$(window).load(function(){
    $("body").css("overflow", "visible");        
    var nice=$('html').niceScroll({cursorborder:"",cursorcolor:"#333333",cursorwidth:"8px", boxzoom:true, autohidemode:false});

});
</script>

回答by MinCarve

here is an example of what you might want:

这是您可能想要的示例:

if (jQuery().niceScroll) {
    $("html").niceScroll({
        scrollspeed: 70,
        mousescrollstep: 38,
        cursorwidth: 15,
        cursorborder: 0,
        cursorcolor: '#0C090A',
        cursorborderradius: 0,
        autohidemode: true,
        horizrailenabled: false
    });
}

回答by Roko C. Buljan

My first thought is to make your classes .nicescrollelements overflow:hidden;inside your css, so the scrollbars won't appear,

我的第一个想法是让你的类.nicescroll元素overflow:hidden;在你的 css 中,这样滚动条就不会出现,

than after your document loads (preferabily on window.load) apply the nicescroll plugin and set your elements to overflow:autowith jQuery like:

比在您的文档加载后(最好在 window.load 上)应用 nicescroll 插件并overflow:auto使用 jQuery设置您的元素,例如:

CSS:

CSS:

.nicescroll{overflow:hidden;}

jQuery:

jQuery:

$(window).load(function(){
   $('.nicescroll').css({overflow:'auto'});
});

I think in your case you'd have to add an ID or a class (like in my example) to your bodyelement.

我认为在您的情况下,您必须向body元素添加一个 ID 或一个类(如我的示例中所示)。