c# - How to give collapse and expand effect to panel on click event -

dear have multiple asp panel inside web page set visible=false on page load , gets open when particular linkbutton clicked works fine, want give slow motion effects or collapse , expand effect accordingly. can share experience please.

protected void linkbutton3_click(object sender, eventargs e) {     pnlwall.visible = true;     pnlsharehome.visible = false; } 

you can use jquery show , hide panels (which <div>'s in html). has sliding possibilities , saves round trip server.

<asp:panel id="panel1" runat="server" style="display: none;">     content </asp:panel>  <input type="button" value="slide panel" onclick="slidepanel('<%= panel1.clientid %>')" />  <script type="text/javascript">     function slidepanel(div) {         if ($('#' + div).css('display') == 'none') {             $('#' + div).slidedown('medium', function () { });         } else {             $('#' + div).slideup('medium', function () { });         }     } </script> 

however if need postback because of content in panel1, can call slidepanel function when done.

protected void button1_click(object sender, eventargs e) {     panel1.visible = true;      //set dom visibility none     panel1.attributes.add("style", "display:none");      //call function slide panel open     scriptmanager.registerstartupscript(page, page.gettype(), "slidepanel", "slidepanel('" + panel1.clientid + "')", true);      //or 1 second delay (1000 ms)     scriptmanager.registerstartupscript(page, page.gettype(), "slidepanel", "settimeout(function () { slidepanel('" + panel1.clientid + "'); }, 1000);", true); }