Checking if an element is hidden

1914

In jQuery, it is possible to toggle the visibility of an element, using the functions .hide(), .show() or.toggle().

Using jQuery, how would you test if an element is visible or hidden?

Since the question refers to a single element, this code might be more suitable:

// Checks for display:[none|block], ignores visible:[true|false]
$(element).is(":visible");

You can use the hidden selector:

// Matches all elements that are hidden
$('element:hidden')

And the visible selector:

// Matches all elements that are visible
$('element:visible')

if ( $(element).css('display') == 'none' ){
    // element is hidden
}

Functions don't work with the visibility attribute.

Javascript