Presentation is loading. Please wait.

Presentation is loading. Please wait.

By ishaq shinwari.  jQuery is a lightweight, "write less, do more", JavaScript library.  The purpose of jQuery is to make it much easier to use JavaScript.

Similar presentations


Presentation on theme: "By ishaq shinwari.  jQuery is a lightweight, "write less, do more", JavaScript library.  The purpose of jQuery is to make it much easier to use JavaScript."— Presentation transcript:

1 By ishaq shinwari

2  jQuery is a lightweight, "write less, do more", JavaScript library.  The purpose of jQuery is to make it much easier to use JavaScript on your website.

3  Many of the biggest companies on the Web use jQuery, such as:  Google  Microsoft  IBM  Netflix

4  jQuery is a JavaScript Library.  jQuery greatly simplifies JavaScript programming.  jQuery is easy to learn.

5  Before you start studying jQuery, you should have a basic knowledge of:  HTML  CSS  JavaScript

6   $(document).ready(function()  {  $("p").click(function(){  $(this).hide();  });   If you click on me, I will disappear.  Click me away!  Click me too!  this is just checking p 

7  $(document).ready(function()  {  $("p").click(function(){  $(this).hide();  });  }); --------------------------------------  $(this).hide() - hides the current element.  $("p").hide() - hides all elements.

8   $(document).ready(function(){  $("p").dblclick(function(){  $(this).hide();  });   If you double-click on me, I will disappear.  Click me away!  Click me too! 

9  $(document).ready(function(){  $("p").dblclick(function(){  $(this).hide();  });

10   $(document).ready(function(){  $("#p1").mouseenter(function(){  alert("You entered p1!");  });   Enter this paragraph. 

11  $(document).ready(function(){  $("#p1").mouseenter(function(){  alert("You entered p1!");  });

12   $(document).ready(function(){  $("#p1").mouseleave(function(){  alert("Bye! You now leave p1!");  });   This is a paragraph. 

13  $(document).ready(function(){  $("#p1").mouseleave(function(){  alert("Bye! You now leave p1!");  });

14   $(document).ready(function(){  $("#p1").mousedown(function(){  alert("Mouse down over p1!");  });   This is a paragraph. 

15  $(document).ready(function(){  $("#p1").mousedown(function(){  alert("Mouse down over p1!");  });

16   $(document).ready(function(){  $("#p1").hover(function(){  alert("You entered p1!");  },  function(){  alert("Bye! You now leave p1!");  });   This is a paragraph. 

17  $(document).ready(function(){  $("#p1").hover(function(){  alert("You entered p1!");  },  function(){  alert("Bye! You now leave p1!");  });

18   $(document).ready(function(){  $("#hide").click(function(){  $("p").hide();  });  $("#show").click(function(){  $("p").show();  });   If you click on the "Hide" button, I will disappear.  Hide  Show 

19  $(document).ready(function(){  $("#hide").click(function(){  $("p").hide();  });  $("#show").click(function(){  $("p").show();  });

20   $(document).ready(function(){  $("button").click(function(){  $("p").toggle();  });   Toggle  This is a paragraph with little content.  This is another small paragraph. 

21  $(document).ready(function(){  $("button").click(function(){  $("p").toggle();  });

22 The End


Download ppt "By ishaq shinwari.  jQuery is a lightweight, "write less, do more", JavaScript library.  The purpose of jQuery is to make it much easier to use JavaScript."

Similar presentations


Ads by Google