jQuery Tutorial


jQuery Example


jQuery References


jQuery Toggle Effect




jQuery Toggle Effect

jQuery toggle() method use to toggle effect in visibility of HTML elements using the show() or hide() methods.

Syntax

$(selector).toggle( speed, [callback]);
  • speed: Elements is a represent by three predefined String speed ("slow", "normal", "fast"). otherwise number represent by milliseconds (Ex. 3000).
  • callback: Callback is optional parameter. It is use to represents a function to be executed whenever effect is completed.

Example:

<html>
<head>
   <script type="text/javascript" src="jquery-1.6.1.min.js"></script>

<script type="text/javascript">
$(document).ready(function(){ 
      $("p").hide();	
    $("#btn1").click(function () {
      $("p").toggle("slow");
    });
});		 
</script>   
</head>

<body>

<button id="btn1">Click To Show Paragraph</button>

  <p style="background-color:#99FFFF;font-size:16px;
  font-family:Verdana;">This Effect is Toggle Effect...</p> 

</body>
</html>
Online Try This Code Your Self....   »

Full Reference of jQuery Effects References Learn all jQuery Effects References.