计算容器元素需要多少滚动才能使其子元素之一可见?

时间:2010-11-21 12:36:24

标签: javascript jquery css scroll overflow

有一个具有指定高度的div元素,它包含许多span元素,因此需要滚动才能看到由于溢出而最初不可见的元素。

我需要计算需要多少滚动才能使它们可见?

谢谢。

<html>
<body>
<div style="width:100px;height:100px;overflow-y:scroll;">
    <div>
        <span>child</span>
        <span>child</span>
        <span>child</span>
        <span>child123</span>
        <span>child</span>
        <span>child</span>
        <span>child</span>
        <span>child</span>
        <span>child35</span>
        <span>child</span>
        <span>child</span>
        <span>child34343</span>
        <span>child</span>
        <span>child</span>
    </div>  
</div>
</body>
</html>

2 个答案:

答案 0 :(得分:0)

我想你可以遍历这些子元素并询问它们与包装div的关系。之后,如果y位置超过div的高度,你可以从y位置减去div的高度,你将得到所需的数字。

如果您提供代码片段或链接到真实页面,我可以向您显示相应的js代码。

答案 1 :(得分:0)

我想你应该把你所有的东西都包裹在一个中间容器里(没有指定高度),然后计算$('#intermediatecontainer')。height()和$('#intermediatecontainer')之间的差异.parent() .height()

实例:http://jsfiddle.net/fcalderan/DE52m/