jQuery Check if Element is Visible/Hidden

By Sam Deering

jQuery code snippet to check whether an element in the DOM is hidden from view of the user. This is useful when determining the state of a toggled elements.

var isVisible = $('#myDiv').is(':visible');
var isHidden = $('#myDiv').is(':hidden');

If you’re simply acting on an element based on its visibility, just include “:visible” or “:hidden” in the selector expression. For example:

$('#myDiv:visible').animate({left: '+=200px'}, 'slow');
  • kevin

    yup, this is imo the best way of checking for hidden elements as it also checks parent elements.


Learn Coding Online
Learn Web Development

Start learning web development and design for free with SitePoint Premium!

Get the latest in JavaScript, once a week, for free.