How to Check an Element is Hidden or Visible using jQuery

Sometimes it needed to check whether a div is visible or hidden before triggering an event. Using jQuery, you can easily detect if a specific element in the web page is hidden or visible. jQuery :visible and :hidden selector is the easiest solution to detect elements visibility.

The example code shows you how to check if an element is visible or hidden using jQuery.

        // Hide if not hidden
        // Show if not visible.  

Elements that consume space in the layout is considered as visible.

Elements are considered hidden if:

  • CSS display value of none.
  • Form elements with type=”hidden”.
  • Width and height are set to 0.

Related Articles

Comments 0