Smooth Scroll для начала в центре?

Question

Я использую плагин jquery для прокрутки, а ширина прокрутки - ширина браузера, поэтому, когда у меня меньше ширины содержимого, чем ширина браузера, я хочу, чтобы контент начинался в центре браузера.

Вот что у меня есть для количества пикселей, которое требуется для центра содержимого.

Jquery

var totalWidth = 0; 
$('.scrollableArea img').each(function(){ 
    totalWidth += parseInt($(this).width(), 10); 
}); 

//totalWidth is the width of the content 

var containWidth = $('#makeMeScrollable').width(); //browser width 

containWidth /= 2; 
totalWidth /= 2; 
startWidth = containWidth - totalWidth; 

Есть ли способ, что я могу сделать так, чтобы содержимое прокрутки начинает startWidth от левой?

Если ширина содержимого меньше, чем ширина браузера, остальная часть scrollDiv заполняется разделителями 75px.

Так что HTML выглядит

HTML

<div class="scrollableArea"> 
    <img/> 
    <img/> 
    <img/> 
    <div class="filler"/> 
    <div class="filler"/> 
    <div class="filler"/> 
    <div class="filler"/> 
    ...etc 
</div> 

Вот сайт плагин http://www.smoothdivscroll.com/

Answer 1

jQueryv1.8.3 + содержит эффекты прокрутки браузера, встроенные в систему. Вы можете использовать этот встроенный функциональность следующим образом:

$('.scrollableArea').scrollLeft(startWidth); 

Вот источник JQuery при условии:

// Create scrollLeft and scrollTop methods 
jQuery.each({scrollLeft: "pageXOffset", scrollTop: "pageYOffset"}, function(method, prop) { 
var top = /Y/.test(prop); 

jQuery.fn[ method ] = function(val) { 
    return jQuery.access(this, function(elem, method, val) { 
     var win = getWindow(elem); 

     if (val === undefined) { 
      return win ? (prop in win) ? win[ prop ] : 
       win.document.documentElement[ method ] : 
       elem[ method ]; 
     } 

     if (win) { 
      win.scrollTo(
       !top ? val : jQuery(win).scrollLeft(), 
       top ? val : jQuery(win).scrollTop() 
      ); 

     } else { 
      elem[ method ] = val; 
     } 
    }, method, val, arguments.length, null); 
}; 
}); 

Answer 2

Smooth Div прокрутки имеет a method called move, с которым вы можете сделать скроллер переместить количество пикселей, которые вы укажете.

Так что, если вы хотите, чтобы прокрутить 100 пикселей вправо вы используете метод, как это:

$("#makeMeScrollable").smoothDivScroll("move", 100); 

Так что если у вас есть положение в пикселях, где вы хотите, чтобы начать, вы можете сделать шаг когда скроллер инициализирован. Я не тестировал этот код, но он должен работать с чем-то следующим образом:

$("#makeMeScrollable").smoothDivScroll({ 
    setupComplete: function(eventObj, data) { 
     $("#makeMeScrollable").smoothDivScroll("move", startWidth); 
    } 
}); 

Надеюсь, я правильно понял ваш вопрос. :-)