I am using Jquery nice Scroll bar for div, but when content of div increases dynamically its not showing scroll bar. Windows default scroll bar works fine if i remove nice scroll. Can anyone help me to solve this problem?
Html
<div id="div-to-scroll">
</div>
Script
$(document).ready(function(e) {
var nice = $("#div-to-scroll").getNiceScroll();
$("#div-to-scroll").niceScroll();
$("#div-to-scroll").getNiceScroll().resize();
});
this is my code sample.
Finally this works for me.
$("#div-to-scroll").scroll(function(){
$("#div-to-scroll").getNiceScroll().resize();
});
for me works just with
$("#div-to-scroll").mouseover(function() {
$("#div-to-scroll").getNiceScroll().resize();
});
UPDATE: new function found!
var setScroll = function(i) {
if($(i).length>0)
$(i).niceScroll().updateScrollBar();
}
Call this function to Update niceScroll
setScroll(".classWithNiceScroll");
Some possible reasons:
1- Maybe you forgot to specify your div height. fix your div Height.
2- also if your div is float in width fix that width too.
Remmember that your DIV STYLE should have: overflow-y: hidden;
UPDATE
try using resize() function every time you scroll down:
$("div-to-scroll").slideDown(function(){
$("div-to-scroll").getNiceScroll().resize();
});
Do this:
// Scroll X Axis
$("#mydiv").getNiceScroll()[0].doScrollLeft(x, duration);
// Scroll Y Axis -
$("#mydiv").getNiceScroll()[0].doScrollTop(y, duration);
or:
// Scroll X Axis
$("#mydiv").getNiceScroll(0).doScrollLeft(x, duration);
// Scroll Y Axis -
$("#mydiv").getNiceScroll(0).doScrollTop(y, duration);
Note [0]
after getNiceScroll()
$("html").mouseover(function() {
$("html").getNiceScroll().resize();
});
To get the scroll bar on full body
来源:https://stackoverflow.com/questions/11862656/jquery-nice-scroll-not-working