jquery ui：ajax页面+滑块内容（第2部分）

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

$(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;
    });
}