title: How to apply custom scrollbar to the whole page?
body: <p>I wanna include <a href="http://manos.malihu.gr/jquery-custom-content-scroller/" rel="nofollow">Jquery custom content scroller</a> to my page in order to replace the main scrollbar. But I can't get it to work for some reason. </p>
  
  <p>Here's my <a href="http://codepen.io/Alexnotonfire/pen/zvVJKX" rel="nofollow">Codepen</a>.</p>
  
  <p>It works well with some smaller blocks of content but how can I apply the plugin to the main scroll?</p>
  
  <p><strong>HTML</strong></p>
  
  <pre><code>&lt;canvas id="canvas"&gt;&lt;/canvas&gt;
  </code></pre>
  
  <p><strong>JS</strong> </p>
  
  <pre><code>(function($) {
    $(window).load(function() {
    $("canvas").mCustomScrollbar();
    });
  })(jQuery);
  </code></pre>