Question

I’m using a very useful scrollbar plugin, called nicescroll.

This plugin takes some time to load, since I’m already using a lot of jquery in my project.

Is it possible someway to hide the default scroll bar of the browser until the script loads, and then the script would do its job and the new scrollbar would appear?

I’m using this code to initialize the plugin:

$(document).ready(function() {
    var nice = $('html').niceScroll({
        cursorborder: "",
        cursorcolor: "#333333",
        cursorwidth: "12px"
    });
});

Answer 1

You could do something like this:

// 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", "auto");        
    var nice=$('html').niceScroll({cursorborder:"",cursorcolor:"#333333",cursorwidth:"12px"});
});

Demo Here

I hope this helps!