Replacing a browser scrollbar with a custom content scroller

Question

I am using jQuery custom content scroller on my site and correctly installed all the files. However, I would like this plugin to replace my default browser scrollbar, and it's hard for me to do this. Obviously, I will need to apply it to the general HTML markup.

To add this plugin to content, the developer offers the following:

<script> (function($){ $(window).load(function(){ $(".your-div-class-here").mCustomScrollbar(); }); })(jQuery); </script> 

So far, to apply it to the browser scrollbar, I tried the code below and it did not work:

 <script> $(document).ready( function() { $("html").mCustomScrollbar(); } ); </script> 

Does anyone know what I'm doing wrong, or how can I get this code to work in a browser?

Answer 1

You need to apply it to the body (not html) tag:

 $("body").mCustomScrollbar(); 

See this demo from the plugin home page: http://manos.malihu.gr/tuts/custom-scrollbar-plugin/full_page_demo.html