5

I'm using the jQuery custom content scroller on my site and have all the files installed correctly. However, I would like this plugin to replace my default browser scrollbar and I'm having a difficult time making that happen. Obviously, I would need to apply it to the overall HTML markup.

To add this plugin to content the developer suggests the following:

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

So far, to apply it to the browser scrollbar, I've tried the code below and it hasn't worked:

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

Does anybody know what I'm doing incorrectly, or how I can make this code work on the browser?

SnoringFrog
  • 1,479
  • 1
  • 16
  • 30
user2482772
  • 51
  • 1
  • 1
  • 2
  • 1
    You can't replace the browser scrollbar with Javascript because this is part of the browser not the page; you can maybe try to wrap your whole site content in a div and apply the scroll on that element – Jaay Jun 13 '13 at 15:12
  • I'm assuming I'm nowhere as near fluent in jQuery as many of the users on this website. Is that what they're doing with this script: http://areaaperta.com/nicescroll/ ? – user2482772 Jun 13 '13 at 15:14

1 Answers1

9

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

$("body").mCustomScrollbar();

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

malihu
  • 790
  • 5
  • 6