PDA

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



slsmithtx
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?

sword-it
12 Jul 2012, 11:14 PM
Hi!

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:-
http://stackoverflow.com/questions/487073/jquery-check-if-element-is-visible-after-scrolling

slsmithtx
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.