How to check if a div is visible using jQuery?

You can use .is(‘:visible’) selects all elements that are visible.

Example

<html>
<head>
<title>divvisible</title>
   <script src="../../Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
   <script type="text/javascript">
      $(document).ready(function () {
         $("button").click(function () {
            var dim = $('#div1').is(":visible");
            if (dim == false) {
               $('#div1').css({ "display": "block", "color": "red" });
            }
         });
      });
   </script>
</head>
<body>
<div id="div1" style="display:none">
<p>Div is visible</p>
</div>
   <button type="button" id="btn" onclick="click()">Click Here</button><br />
</body>
</html>
Updated on: 2020-06-22T07:58:38+05:30

13K+ Views

Kickstart Your Career

Get certified by completing the course

Get Started
Advertisements