LaravelCode

Search

How to check if an element is hidden using jQuery

jQuery
2463 views 4 years ago
post-title

Use the jQuery :hidden Selector

The jQuery :hidden selector can be used to test whether an element is hidden or not on a page.

You can also use this selector to test the elements whose  width  and  height  are set to 0 as well as the form elements with the attribute type="hidden". Let's see how it works:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery Test If an Element is Hidden</title>
<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<script>
    $(document).ready(function(){
        $("button").click(function(){
            // show hide paragraph on button click
            $("p").toggle("slow", function(){
                // check paragraph once toggle effect is completed
                if($("p").is(":hidden")){
                    alert("The paragraph  is hidden.");
                } else{
                    alert("The paragraph  is visible.");
                }
            });
        });
    });
</script>
</head>
<body>
    <button type="button">Toggle Paragraph Display</button>
    <p>Lorem ipsum dolor sit amet adipi elit...</p>
</body> 
</html>

 

Random Articles
  • How to use Multiple Databases in Laravel
    You already know how to connect MySQL database with Laravel application. But sometimes, you might need to use multiple databases with single Laravel application. Or you might needed to synchronize dat...
  • Create CRUD using Ajax with Example in PHP
    In this tutorial, we learn to insert update efface in PHP MySQL with example in one form in PHP. We learn how to insert update efface in PHP on the same page. we will show you how to fetch insert u...
  • Start Applications Automatically on Login in Ubuntu
    Many of us need to open certain application while working on computer. Applications like File Manager, Web browser text editor are the common application that anyone needed everytime while working on...
  • Uploading multiple files with PHP cURL
    Once I was working in the project where I needed to create PHP cURL request with multiple file option. After I have done it, I thought it is good idea to share code with all of you. In this article...
  • How to create a string by joining the values of an array in PHP
    Use the PHP&nbsp;implode()&nbsp;or&nbsp;join()&nbsp;function You can use the PHP&nbsp;implode()&nbsp;or&nbsp;join()&nbsp;function for creating a string by joining the values or elements of an array...
Advertise