Search code examples
jqueryjscrollpane

jScrollPane synchronicity


I'm having a synchronicity problem with jScrollPane.
I'm updating a div content via Ajax, when this div is updated i have to reinitialize jScrollPane. When the html code is too large, the jScrollPane() call seems to use just a part of the content i'm updating, and some elements stays out of the scrollPane. If i put the jScrollPane() call inside a setTimeout with a second, it works, but i know that is not a good way to solve this.
Sorry my bad english.

That's the code:

success : function(HTMLcode){ 
    $("#div_inside").empty().html(HTMLcode); 
    $('#pane').jScrollPane(); 
    //SET SCROLL POSITION 
    $('#pane')[0].scrollTo(panetop); 
}

Solution

  • I encountered a similar problem recently -- turned out that once the HTML had loaded, the external images in that HTML hadn't. So: HTML loads, then jScrollpane resizes, and THEN the images load and change the length of the HTML again.

    The weak solution is to trigger jScrollpane with a setTimeout, as you have.

    The good solution is to go through your HTML that's being loaded and assign width and height attributes to EVERY image tag. That way, it will be the correct length even before the images load.

    If you can't edit that loaded HTML, though, then the setTimeout is probably your simplest solution.