What is JQuery and JQuery Hide and Show method examples

JQuery is a fast, small and multi-browser JavaScript Library which greatly simplifies Java Script programming. It’s initial release was released on 26th Aug 2006 and it is written in Java Script. It’s easy to learn and the most popular JavaScript library in use today.

It’s syntax is designed to make it easier and to navigate a document, create animations, handle events, and develop Ajax applications.

Following example will explain you how to work with JQuery.

Example of JQuery hide and show method:

Now you can hide and show HTML elements with the hide() and show() methods:

<!DOCTYPE html>
<html>
<head>
<script src=“//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js”>
script>
<script>
$(document).ready(function(){
  $(“#hide”).click(function(){
    $(“h1”).hide();
  });
  $(“#show”).click(function(){
    $(“h1”).show();
  });
});
script>
head>
<body>
<button id=“hide”>Hidebutton>
<button id=“show”>Showbutton>
<h1><font color=“green”> This text will appear and disappear with the operation of above button. </font></h1>
</body>

</html>


After clicking on Show button, the result will be:

JQuery Hide and Show method

Following example is showing the speed parameter with the hide() method:


<!DOCTYPE html>
<html>
<head>
<script src=“//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js”>
script>
<script>
$(document).ready(function(){
  $(“#hide”).click(function(){
    $(“h1”).hide(1000);
  });
});
$(document).ready(function(){
  $(“#show”).click(function(){
    $(“h1”).show(1000);
  });
});
script>
head>
<body>
<button id=“hide”>Hidebutton>
<button id=“show”>Showbutton>
<h1>First Line</h1>
<h1>Second Line</h1>
</body>
</html>

After clicking on Hide button, the result will look like this:

 JQuery Hide and Show method
I hope you liked this article.
SiteGround Black Friday Sale Below Banner

Get Free Blogging Tips & Technology updates in your Email !!!

Subscribe via RSS feed

The following two tabs change content below.
Anil Kumar
IT Blogger Tips focus on Blogging Tips, SEO Tips, Social Media, SQL Tips, PL/SQL Tips, Oracle DBA, Linux/Unix, Latest Technology, How Tos and Technical Solutions. You can find us on Facebook | Twitter |
Find on Google+

Siteground SALE
70% OFF SiteGround WordPress Hosting – $2.95/month (Exclusive Offer !!!)