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

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

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

添加此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工作。柯丹

---

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

您可以使用JQuery来完成，这比其他查询更简单

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

---

检查一下你所说的“滚动到中间”是什么意思？@Amit你在那把小提琴上到底改变了什么？我更新了这个问题，所以它链接到一个包含e4链接的小提琴。这几乎就是我想要的。但它会将元素滚动到顶部。我想将它滚动到中心。可能重复usign Jquery您可以这样做：这可能是正确的方向。如果没有jquery，就没有ease解决方案。计算可能还不完全正确。例如，当您尝试使用元素6时，它会失败。是的，它将取决于我们想要在中心滚动的div的大小，然而这是一个想法。

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