CSS

Common Errors with NanoScroller

For nanoScroller to properly work, there has to be:

1. Html structure:

A parent div with class “nano”, a child div with the class “nano-content” (used to be “content” in older versions). This could be modified, but the default pair is “nano” and “nano-content”. Or error logs: Cannot read property 'style' of undefined.

<div class="nano">
  <div class="nano-content"></div>
</div>

2. Include the nanoscroller.css file.

3. Before initialising, make sure:

  • the html inside .nano is already loaded
  • the div .nano is not display: none;
  • the height of .nano-content is larger than that of .nano

Without any of these, nanoScroller won’t be working properly.

 

Some other errors:

1. Not being able to scroll inside the main part of .nano, but scrolling on .nano-pane works fine:

  • Check if overflow: hidden is set upon .nano-content. It shouldn’t be.

 

Standard