Jquery jscrollPane自动重新初始化不适用于水平滚动条

我在重新初始化horizonal jScrollPane时遇到了一些问题。当页面加载4个图像时，将动态加载，当用户在面板中滚动时，应显示下4个图像，但不会发生这种情况，下一个图像在那里，但.jspPane的大小保持不变，因此不再允许滚动条

代码如下：

$(function()
        {
            var pane = $('.scroll-pane');
            pane.jScrollPane({showArrows: true,autoReinitialise: true});
            var contentPane = pane.data('jsp').getContentPane();
            var api = pane.data('jsp');
            var $rowItems = $('<p></p>');
            var showItems = 4;
            var startItem = 0;
            var itemWidth = 100;

            contentPane.append($rowItems)

            getThumbnails(startItem);

             pane.scroll(function(){
                var paneWidth = $(this).width();
                var contentWidth = $rowItems.width();
                var scrollPosition = Math.abs(parseInt($('.jspPane').css('left')));
                console.log(contentWidth - paneWidth - scrollPosition);
                if ((contentWidth - paneWidth - scrollPosition) < 10){                      
                    startItem = startItem + showItems;
                    getThumbnails(startItem);
                }
            })

            function getThumbnails(n){
                $.ajax({
                    url : 'items.xml',
                    success : function(data){                   
                        for( var i = n; i< n + showItems; i++){
                            $rowItems.append('<a href="'+ $(data).find('item').eq(i).attr('thumb') +'" id="pic'+ i +'"></a>');
                            loadImageThumb($(data).find('item').eq(i).attr('thumb'), $(data).find('item').eq(i).attr('imageUrl'),$(data).find('item').eq(i).find('description').text(), i);                 

                        }

                    }               
                })
            }

            function loadImageThumb(thumb, img, description, i){                    
                var image = new Image();                                                    
                $(image).load(function(){
                    var height = 80,
                        $pic = $('#pic'+ i, $rowItems),
                        imgURL = $pic.attr('href');                                
                    $pic.attr('href',imgURL);                           
                    $(this).appendTo($pic).hide().fadeIn('slow');

                }).attr('src', thumb);

            }


        });

$（函数（）
{
变量窗格=$（'滚动窗格'）；
jScrollPane（{showArrows:true，autoreinitialize:true}）；
var contentPane=pane.data（'jsp'）.getContentPane（）；
var api=pane.data（'jsp'）；
var$rowItems=$（“
”）；
var showItems=4；
var-startItem=0；
var itemWidth=100；
contentPane.append（$rowItems）
短指甲（星型）；
pane.scroll（函数（）{
var paneWidth=$（this）.width（）；
var contentWidth=$rowItems.width（）；
var scrollPosition=Math.abs（parseInt（$（'.jspPane'）.css（'left'））；
log（contentWidth-paneWidth-scrollPosition）；
如果（（contentWidth-Panewith-scrollPosition）<10）{
startItem=startItem+展示项目；
短指甲（星型）；
}
})
函数获取缩略图（n）{
$.ajax({
url:'items.xml'，
成功：函数（数据）{
对于（变量i=n；i

我对垂直滚动窗格使用了类似的代码，它确实起了作用。

---

非常感谢您的帮助。

我找到了解决问题的方法。

---

每个元素的宽度都是必需的。

我找到了解决问题的方法。 每个元素的宽度都是必需的