jQuery: How to Test if a div is Visible Programming 17 JUL 2013

jquery-logoThe wonderful jQuery library actually makes it pretty easy for us to test whether or not a div (or pretty much any other element for that matter) is currently visible, by providing us with a ‘:visible’ selector.

Basically elements are considered visible by jQuery if they consume space in the document, meaning that visible elements have a width or height that is greater than zero. Combining this with the .is filter forms the basis for our test.

In practice:

//assuming a div with id "div1"
alert ($('#div1').is(':visible')); //true
alert ($('#div1').is(':visible')); //false

Nifty. As always, play with around with it yourself in the awesome JSFiddle online JavaScript playground.

Related Posts:

About Craig Lotter

South African software architect and developer at Touchwork. Husband to a cupcake baker and father to two little girls. I don't have time for myself any more.