jQuery: jScrollHorizontalPane - Ajout dynamique de contenu

Question

J'ai un ensemble d'images dans un panneau jScrollHorizontalPane et je souhaite pouvoir modifier le contenu du volet par projet.

Actuellement, c'est ce que je chargeais chaque fois qu'un projet est sélectionné:

$.each(project.images || [], function() 
{ 
    if(this == "") return; 
    imgCont.append('<div class="image-item"><img height="225" src="' + this + '" /></div>'); 
}); 
var width = 0; 
imgCont.find('img').each(function() 
{ 
    width += $(this).width(); 
}); 
imgCont.width(width); 
$('#project-images-scroll').jScrollHorizontalPane (
    { 
     scrollbarHeight:10, 
     scrollbarMargin:0, 
     reset:true, 
     animateTo:false, 
     animateInterval:25, 
     animateStep:5 
    } 
); 

Mais ce qui finit par se produire est la barre de défilement est remis à zéro, mais ne fonctionne pas lorsque vous cliquez dessus.

Toute aide à ce sujet serait grandement appréciée.

Answer 1

La façon de résoudre ce problème était de cloner l'intégralité de l'arborescence du défileur. Ensuite, sur chaque instance de changement de contenu, l'arbre entier devrait être .remove() et réinitialisé à partir d'un clone du clone.