dirai dirai - 4 months ago 10x
jQuery Question

scrollbar keeps on scrolling down in jstree

I have a set of data being displayed as a tree by the help of jstree plugin and jquery.

The data shows up perfectly in the tree structure. On expanding the last node in the tree the scrollbar appears on the right side of the div block.

However if I navigate within the tree with the mouse over the scrollbar, the scrollbar keeps on scrolling down and does not go up.

I am at wits end what could the reason be. I am using a Mozilla Firefox browser.

Please help.

Sample Code below:


.myScrollableBlock {


<div id="myTreeDiv" class="myScrollableBlock">


// jsTree plugins

  • How to Solve

You just have to create another div, before the div where you instantiate the jstree, and add the class="myScrollableBlock" at the outer div. Like this:

<div class="myScrollableBlock">
<div id="myTreeDiv">
  • Explanation

When you dinamically create the jstree, calling


it overlaps any other css style on '#myTreeDiv' tag.

You can make a quick check this way:

<div style="padding: 20px 20px; overflow: auto; height:170px;">
<div id="myTreeDiv"></div>