Calculate how much scrolling is needed for a container element to make one of the its children element visible?
There is a div element with specified height and it contains lots of span elements so scrolling is needed to see elements which are initially invisible due to overflow.
I need to calculate how much scrolling is needed in order to make them visible ?
Thank you.
<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&开发者_StackOverflow中文版gt;
</div>
</div>
</body>
</html>
I suppose you can iterate through these child elements and ask them for their position in relation to wrapping div. After that if y-position is more than height of div you can just subtract div's height from y-position and you will get desired number.
If you provide snippet of your code or link to real page I could show you appropriate js code.
I suppose you should wrap all you span inside an intermediate container (without specifing an height), then calculate the difference between $('#intermediatecontainer').height() and $('#intermediatecontainer').parent().height()
Live example : http://jsfiddle.net/fcalderan/DE52m/
精彩评论