jquery nicescroll

Question

我使用的是nicescroll插件。http://areaaperta.com/nicescroll/

我有一个小小的疑问。当页面加载后，我可以在浏览器中看到默认的滚动条，然后显示nicescroll条。我想要将nicescroll条应用于所有文档，我有以下代码

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

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

有人知道为什么会这样吗？谢谢

Answer 1

也许这对你有帮助。这对我很管用。

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

Answer 2

以下是您可能需要的示例：

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

Answer 3

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

而不是在文档加载之后(最好是在window.load上)，应用nicescroll插件，并使用jQuery将元素设置为overflow:auto，如下所示：

CSS：

.nicescroll{overflow:hidden;}

jQuery：

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

我认为在您的示例中，您必须向body元素添加一个ID或一个类(就像我的示例中一样)。