Take the 2-minute tour ×

Before I call:


I want to know if it is currently hidden or visible.

share|improve this question
add comment

4 Answers

up vote 8 down vote accepted

You can test this with the css() function:

if ($('myObject').css('display') == 'none') {


Wasn't aware of how cool the :hidden selector is. My suggestion is still useful for testing other attributes, but Alex's suggestion is nicer in this case.

share|improve this answer
I think the value for display is 'none', or for visibility is 'hidden'. –  CodeMonkey1 Feb 4 '09 at 16:33
Yes, I was already editing that. Thanks. –  Adam Lassek Feb 4 '09 at 16:34
The :hidden and :visible selectors check both display and visibility as well as hidden inputs. –  CodeMonkey1 Feb 4 '09 at 16:38
add comment

There's 2 ways to do it, that I know of:

if ($('#something').is(':hidden')) { }


if ($('#something').is(':visible')) { }

They should both work.

You can also do something like this:


Which will only call .show() if the item is already hidden, or only call .hide() if the item is already visible.

share|improve this answer
add comment

You could also use the Toggle $(this).toggle();

share|improve this answer
+1, This is a much simple solution if you only want to toggle state of the object. –  Alex Fort Feb 4 '09 at 16:56
add comment

From jQuery FAQ:

 var isVisible = $('myObject').is(':visible');
 var isHidden = $('myObject').is(':hidden');
share|improve this answer
add comment

Your Answer


