jquery - 如何将水平滚动条定位在DIV的中心

Question

我试图将水平滚动条定位在该 div 的中心。我厌倦了 window.scrollTo() 但这适用于页面滚动而不是 div 滚动。

$(document).ready(function(){
    var outerContentWidth = $('.abc').width();
    var scrollPosition = outerContentWidth/2;
    $('.abc').scrollLeft(scrollPosition);

});

演示:fiddle

Answer 1

通过在 jQuery 中进行简单的更改，以下内容将为您提供所需的效果并滚动到 div 的中心:

$(document).ready(function(){
    var outerContent = $('.abc');
    var innerContent = $('.abc > div');

    outerContent.scrollLeft((innerContent.width() - outerContent.width()) / 2);        
});

This code will set the scroll bar to the center of the inner content. But lets examine why. We know the minimum value for scrollLeft is zero, and the maximum is inner.width() - outer.width(). So, half way is easily half the maximum.

有关该主题的更多信息here .

Demo