javascriptjquery

How can I tell if a DOM object is out of the window using JavaScript?

I'm looking for a method to know if a object (as a Div, a img, etc.) is displayed and visible by the user at the window in JavaScript / jQuery.

When I say "is displayed and visible", that's when the user don't scroll the page enough to let's the object visible (If you know what I mean). But if the user scroll the page and the div is no longer visible (is out the window) the function what I'm looking for should know that.

Solution

  • You should use Viewport selectors for jQuery to check if the element is currently visible in the actual viewport.

    Here's a demo to show you what I mean.