Coding

jQuery – Checking Visibility

Faraz

To check if an element is visible using jQuery, you can use .is(':visible'). If you wanted to check whether an element is hidden then you would use .is(':hidden) instead.

These functions work as long as you use jQuery to hide and show elements, but if you use CSS to hide the visibility of an element, it won’t work. To check the CSS property of an element you can use the following code:

 if ($('#someElement').css("visibility") == "hidden"){
 // do something
 }

It also would also be nice to have a way to find out all the elements inside another element, and check for their visibility.

$('#someElement *').each(function() {
    if($(this).is(':hidden')) {
        // do something if it's hidden
    }
})

or..

$('#someElement *').each(function() {
    if($(this).css("visibility") == "hidden") {
        // do something if it's hidden
    }
})

Have your say