javascript - 计算容器垂直滚动多少才能可见

Question

我有一个高度为 400 且溢出为 true 的 div 容器。

它有垂直滚动条。

该 div 内有更多 html 内容。

现在我想获取子div的滚动高度，以便我可以通过代码滚动滚动条。

    <div id="container">
    <div id="b1">
    // let say it's height is 200px so that next div is not visible
    </div>
    <div >
    // let say it's height is some i don't have
    </div>
    <div>

        <div id="b2">
            XYZ content
        </div>
    </div>
</div>

//现在我想计算，我应该滚动多少才能使 #b2 可见？

Answer 1

你可以使用offsetTop来找到你想要的 block 的y坐标，但不要忘记从parentContainer的offsetTop中减去它。

var container = document.getElementById('container'),
    b2 = document.getElementById('b2');

container.scrollTop = b2.offsetTop - container.offsetTop;

jsFiddle example

祝你好运!