View Full Version : Finding out if an element is hidden by scrolling

12 Jul 2012, 11:04 AM
Is there a way to determine that an element is below or above the display of a scrolled container, in other words out of sight?

12 Jul 2012, 11:14 PM

i have a container with scrolling in it.
now i am finding is my element (under container) is hide or not (Due to scrolling)

function elementStateInScrolling(yourElem){
var containerTop = yourContainer.getScroll( ).top()
, containerBottom = containerTop + yourContainer.getHeight()
, elemTop = yourElem.getEl().getY()
, elemBottom = elemTop + yourElem.getHeight();

return ((elemBottom <= containerBottom) && (elemTop >= containerTop));

for more info, refer to this:-

17 Jul 2012, 3:49 PM
Thanks for the help! I had to make a slight adjustment to your code to get it to work in my situation:

elementStateInScrolling: function (el,ctr){
var containerTop, containerBottom, elemTop, elemBottom;
containerTop = ctr.getY();
containerBottom = containerTop + ctr.getHeight();
elemTop = el.getY();
elemBottom = elemTop + el.getHeight();
return ((elemBottom <= containerBottom) && (elemTop >= containerTop));

I'm passing in the container object and using getY to get it's top position instead of top.