Golang React JS Technology Blog

jQuery check if an element is visible or hidden

Use Visibility Filter Selector 
<script>
   $(document).ready(function() {
       var isVisible = $('#visibleElement').is(':visible'); // True
       var isHidden = $('#hiddenElement').is(':hidden'); // True
   });
</script>
Complete Example 
<!DOCTYPE html>
<html lang="en">

<head>
    <style>
        #hiddenElement {
            display: none;
        }
        
        #visibleElement {
            display: block;
        }
    </style>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.js"></script>
    <script>
        $(document).ready(function() {
            var isVisible = $('#visibleElement').is(':visible'); // True
            var isHidden = $('#hiddenElement').is(':hidden'); // True
        });
    </script>
</head>

<body>
    <div id="hiddenElement">
        Test
    </div>
    <div id="visibleElement">
        Test
    </div>
</body>

</html>
Most Helpful This Week
How to scroll page to particular Div on click using jQuery? How to check a variable is undefined in JavaScript? ES6 method of declaration multiple variables in one line JavaScript simple alert on Click Highlight and get the details of table row on click using JavaScript Edit the text of label on click using jQuery