时间戳

首页 > 解决方案 > 如何滚动以使特定元素位于 div 可见区域的中间？

javascript - 如何滚动以使特定元素位于 div 可见区域的中间？

问题描述

我有一系列列表项，我想将每个特定项放在其父 div 的可见区域的中间。所以第一个元素可以滚动到中间我在它之前添加了一些虚拟项目。（以及列表项的末尾）。这是我的功能：

function scrollToMiddleView(elem) {
    if (elem) {
        var main = $("#container");
        m = main.scrollTop() + main.height() / 2;
        t = main.offset().top + m;
        main.animate({scrollTop: elem.offset().top - t}, 500);

    }
}

我在一系列元素上对其进行测试。它适用于某些元素，不适用于其他一些元素。我在滚动条位于顶部时工作。我希望每个元素都精确地位于中间。

标签： javascriptjqueryhtml

解决方案

这是有效的功能。main.scrollTop()必须减去，main.offset().top然后必须减去结果elem.offset().top。

function scrollToMiddleView(elem) {
    if (elem) {
        var main = $("#container");
        m = main.height() / 2;
        t = main.offset().top - main.scrollTop() + m;
        q = elem.offset().top - t;
        main.animate({scrollTop: q}, 500);

    }
}

推荐阅读