CODEWITHSUNDEEP
jqueryhtmldynamicnicescroll
Mark Löwe
Mark Löwe

Reputation: 582

jQuery niceScroll not working on Dynamic DIV

I've been struggling with this problem for weeks, and I've researched dozens of posts on this site and others. I have a very basic problem. I have a DIV tag #scrollarea that is created on the fly, destroyed and recreated on the fly several times in a single web app. My problem is that the niceScroll feature only works ONCE. After the second attempt, I no longer get the controls

I've tried several techniques including the resize() method, and nothing works. I've also installed a regulator that ensures that it's only installed once, and then resize()'d after that. Again, nothing works.

It's a very difficult thing to demonstrate here given that my code is locked behind secure doors, and it's triggered through scripts.

Does anyone have a suggestion of how this can be done? To review:

Methods attempted:

All techniques fail to render a usable scrollbar on the second use.

Upvotes: 1

Views: 9541

Answers (3)

Cliff T
Cliff T

Reputation: 227

I had a similar problem using an empty div that I could add dynamic content to when certain events were triggered, however, upon adding content, the scrollbar would not appear. I got it to work by prepopulating the scrollbar div with another empty div with a height that overflowed the div I had the scrollbar on.

Upvotes: 0

Code Spy
Code Spy

Reputation: 9964

UPDATE: new function found!

 var setScroll = function(i) {
        if($(i).length>0)
        $(i).niceScroll().updateScrollBar();
}

Call this function to Update niceScroll 

setScroll(".classWithNiceScroll");

-----Old Method-----

use this instead of resize

$("idORclass").getNiceScroll().remove()
$("idORclass").nicescroll();

Upvotes: 7

LeGEC
LeGEC

Reputation: 51988

script fires again, #scrollarea is replaced by NEW scrollarea

What do you mean by that ? is your #scrollarea removed from the DOM, and a new one inserted ? or do you have its content replaced, like $('#scrollarea').html( blabla ) ?

Have you tried $(window).trigger('resize') ? nicescroll seems to watch for resize events, but not for DOM changes.

Upvotes: 0

Related Questions