Вопрос

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

Лицензировано под: CC-BY-SA с атрибуция
Не связан с StackOverflow
scroll top