Jquery ui jQueryUI:ajax页面+滑块内容（第2部分）

跟进我之前做的这件事。我已经找到了所有问题的答案。但我仍然有一个很小的特威克，我不能把它弄对-

这是我需要传递给滑块的百分比值-

var percentage = Math.round(offset.left / (scrollContent.width() - scrollPane.width()) * 100);
scrollbar.slider("value",percentage);

每次向右移动滑块控制柄时，百分比都应增加。加载前两个ajax页面时，百分比会增加，但在前两个页面之后，百分比开始下降，直到出现负值

我怎样才能找到正确的百分比

你可以试试看，看看我上面的意思

下面是整个jquery代码：

$(document).ready(function(){

    loadSlide ();

});


function loadSlide ()
{
    //scrollpane parts
    scrollPane = $('#scroll-pane'); // scroll-pane
    scrollContent = $('#scroll-content'); // scroll-content

    //alert(scrollContent.width());

  scrollbar = $("#content-slider").slider({
    min: 0,
    create: loadContent,
    animate: true,
    change: handleSliderChange,
    slide: handleSliderSlide
  });
}

function handleSliderChange(event, ui)
{

  var maxScroll = scrollContent.width() - scrollPane.width();
  scrollPane.animate({scrollLeft: ui.value * (maxScroll / 100) }, 1000);

}

function handleSliderSlide(event, ui)
{

  var maxScroll = scrollContent.width() - scrollPane.width();
  scrollPane.attr({scrollLeft: ui.value * (maxScroll / 100) });

}

function loadContent(event, ui) 
{
    $('.load-content').click(function(){

        var path = $(this).attr('href');
        var parent = $(this).parents('.content-item');

        parent.after('<div class="wrapper"></div>');

        var target = $('.wrapper').css({float:'left'});
        target.load(path, function(){

            var width_loaded_content = target.width();
            var offset = target.offset();
            var position = target.position();
            scrollContent.css({width: (scrollContent.width() + width_loaded_content) + 'px'});

            var percentage = Math.round(offset.left / (scrollContent.width() - scrollPane.width()) * 100);
            alert(percentage);
            scrollbar.slider("value",percentage);

            exitContent (target);
        });

        return false;
    });
}

function exitContent (target)
{
    $('.exit-content').click(function(){
        scrollbar.slider("value",0);
        scrollContent.css({width: (1500) + 'px'});
        target.remove();
        return false;
    });
}

另一个问题是，为什么它有时会在加载ajax页面后发出两次警报，但有时不会？它应该总是发出一次警报

有什么想法吗