Toggling panel using Jquery

Enter this code just below the <title> tag. File name “jquery-1.2.6.min.js” depends on the jquery file you have downloaded.

<script src="jquery-1.2.6.min.js" type="text/javascript"></script>

Then Add css code to give style to the panels.

   1:  <style type="text/css">

   2:          .Header

   3:          {

   4:              color: white;

   5:              background-color: Black;

   6:              font: bold 13px auto "Trebuchet MS",

                   Verdana;

   7:              font-size: 12px;

   8:              cursor: pointer;

   9:              width:500px;

  10:              height:18px;

  11:              padding: 4px;            

  12:          }

  13:          .Body

  14:          {

  15:              background-color: Cyan;

  16:              font: normal 11px auto Verdana, Arial;

  17:              border: 1px gray;                

  18:              width:500px;

  19:              padding: 4px;

  20:              padding-top: 7px;

  21:          }       

  22:      </style>

Add the jquery code which does the panel toggling

   1:  <script type="text/javascript">

   2:          $(document).ready(function() 

   3:            {

   4:              $('#Panel1').click(function() 

   5:                {

   6:                  $('#Panel2').slideToggle('slow');

   7:                }

   8:               );

   9:             }

  10:           );

  11:      </script>

All the above codes are continuous one after another.
Now it’s the time to add two panels, first panel with a label and second panel with some text in it. On clicking the first panel second panel with text will toggle...
Add this code just after form tag or add it through .NET interface.

<asp:Panel ID="Panel1" runat="server" CssClass="Header">
<asp:Label ID="Label1" runat="server">
What is JQuery {Click here to toggle}</asp:Label></asp:Panel>
                
<asp:Panel ID="Panel2" runat="server" CssClass="Body">
JQuery is a lightweight JavaScript library that emphasizes interaction between JavaScript and HTML. It was released January 2006 at BarCamp NYC by John Resig. Dual licensed under the MIT License and the GNU General Public License, jQuery is free and open source software.
     Both Microsoft and Nokia have announced plans to bundle jQuery[1] on their platforms, Microsoft adopting it initially within Visual Studio[2] and use within Microsoft's ASP.NET AJAX framework and ASP.NET MVC Framework whilst okia will integrate it into their Web Run-Time platform.
</asp:Panel>

This is what JQUERY code less do more….