How to use Hide and Show Function using jQuery


in this article, you will learn How to use Hide and Show Function using jQuery.

Example:-
<html>
<head>
<title>Hide Show Function</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
  $("#hide").click(function(){
    $("p").hide();
  });
  $("#show").click(function(){
    $("p").show();
  });
});
</script>
</head>
<body>
<p>If click on the "Hide" button, it will be hide and if click on show button it will be show.</p>
<button id="hide">Hide</button>
<button id="show">Show</button>
</body>
</html>
Hide or Show function using Speed
<html>
<head>
<title>Hide and Show Function using Speed</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
  $("button").click(function(){
    $("p").hide(1000);
  });
  $("#show").click(function(){
    $("p").show(1000);
  });
});
</script>
</head>
<body>
<button>Hide</button>
<button id="show">show</button>
<p>Hide and Show Function using Speed.</p>
</body>
</html>
Read Full article

Comments

Popular posts from this blog

Student Result Management System

What Is The Job Role Of A Customer Support Executive?

TOP RECRUITMENT COMPANIES IN INDIA