javascript - 将一个 HTML 元素滚动到另一个元素的中心

Question

我想通过 Javascript 将一个元素滚动到另一个元素的中心。这是一个例子:

http://jsfiddle.net/acpnLwtw/

<div class=container>
    <div id=e1>1</div>
    <div id=e2>2</div>
    ...
</div>

如何将给定元素滚动到容器的中心？ #e4 的链接几乎可以完成它，但它会将元素滚动到顶部。

Answer 1

添加这个 jQuery 脚本

$( document ).ready(function() {
    $("#goto").click(function() {
        $(".container").scrollTop($(".container").scrollTop()+($("#e4").position().top - $(".container").height()/2) );    
    })
});

HTML修改

<div id="goto" >Go to element 4</div>

使用 jQuery 工作。积分 ketan

Fiddle Link

它取决于要滚动到中心的 div 的大小。计算由您决定。