Question

Using jQuery, what is the easiest way to determine whether a particular element is visible? I don’t mean visible within the current viewport, but on the page.

Ideally, the function should return false if the element or any of its ancestors has a CSS rule such as display: none or visibility: hidden. No need to worry about overflow: hidden.

Answer 1

Use :visible selector with is method.

if($('elementSelector').is(':visible')){
   //Element is visible
}