Как определить, является ли определенный элемент DOM видимым или нет?

Question

С помощью jQuery, какой самый простой способ определить, является ли определенный элемент видимым? Я имею в виду не видимый в текущем окне просмотра, а на странице.

В идеале функция должна возвращать false, если элемент или любой из его предков имеет правило CSS, такое как display: none или visibility: hidden. Не нужно беспокоиться о overflow: hidden.

Answer 1

Использовать селектор :visible с методом is.

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

Answer 2

$('div:visible'); вернет все видимое divs.

Также стоит отметить этот раздел журнала изменений jQuery 1.3.2 :

В jQuery 1.3.2 элемент виден, если его браузер сообщил об этомoffsetWidth или offsetHeight больше 0. Это означает, что если CSS-элемент вашего элемента имеет значение «none» или любой из элементов отображения родительского / родительского элемента имеет значение «none», или если ширина элемента равна 0, а высота элемента равна 0, тогдаэлемент будет сообщаться как скрытый.

Answer 3

Вы можете использовать is() метод.

$('#element').is(':visible');

Answer 4

http://api.jquery.com/visible-selector/

$('#mydiv').is(":visible");