2

I have a child DIV named "Intro", on which Nicescroll is set:

$(document).ready(function({
$("#Intro").niceScroll({
cursorcolor:"#666",
cursoropacitymax:0.7,
cursorwidth:5,
cursorborder:"1px solid #2848BE",
cursorborderradius:"4px",
background:"#ccc",
autohidemode:"false"}).cursor.css({"background-mage":"url(img/mac6scroll.png)"});

Everything works fine, but the problem is that when scrolling the child DIV using Nicescroll reaches to the bottom of the child DIV, the the parent DIV does not start scrolling the parent DIV.

I know that Nicescroll has an option called nativeparentscrolling which is set to true by default. However no matter if I include this option in the code and set it explicitly to true or do not include it, the child DIV scrolls to the bottom and stops there. The same is true when one scrolls upward. It stops at top and the parent DIV does not scroll the parent DIV.

The same behaviour is true when I'm on a mobile/Tablet device.

Can any help me with this issue to make Nicescroll even more nicer?

Feri
  • 221
  • 3
  • 10

1 Answers1

0

This worked for me using only css, you may have to adjust widths of your rails to meet your design needs :

#your-element { //the element using nicescroll
 overflow-y: scroll !important; //brings back browser scroll functionality
}   
#your-element::-webkit-scrollbar {
 display: none; //hides vertical scrollbar on webkit browsers
}

//cover up the other browsers vertical scrollbar
.nicescroll-rails {
 background: #fff;
}
.nicescroll-rails:before {
    content: '';
 position: absolute;
 height: (height of your element or 100%);
 width: 30px;
 top: 0;
 left: -20px;
 background-color: #fff;
}
Kobold556
  • 1
  • 1