jQuery show hide method is used to make HTML elements appear and disappear. jQuery methods allow us to quickly apply commonly used effects.
To hide a div
element using jQuery, you can use the .hide()
method. If want to hide any selected div after clicking a button you can use the following code:
hide a specific div using jQuery.
Here's a basic example:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Hide Div Example</title>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
$(document).ready(function() {
$("#hideButton").click(function() {
$("#myDiv").hide();
});
});
</script>
</head>
<body>
<div id="myDiv">This is the div to be hidden.</div>
<button id="hideButton">Hide Div</button>
</body>
</html>
When you click on hide div, the div
with the id myDiv
will be hidden.
It is very easy to set effects in application using jQuery.
You can also use .hide() directly in your script to hide a div immediately.
how to hide a div With Animation effect
You can also use .hide() with a duration for animation:
Hides the element with a fade-out effect over 500 milliseconds
$("#myDiv").hide(500); //
=================================