CollapsiblePanel控件,该控件可以显示或者隐藏某一指定的页面面板内的内容。

<% @ Page Language="C#" AutoEventWireup="true" CodeFile="CollapsiblePanelDemo.aspx.cs" 
Inherits="CollapsiblePanelDemo" %>

<% @ Register Assembly="System.Web.Extensions, Version=1.0.61025.0, Culture=neutral,
PublicKeyToken=31bf3856ad364e35"
Namespace="System.Web.UI" TagPrefix="asp" %>

<% @ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>

<! DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >

< html xmlns ="http://www.w3.org/1999/xhtml" >
< head runat ="server" >
< title > 无标题页 </ title >
</ head >
< body >
< form id ="form1" runat ="server" >
< div >
< asp:ScriptManager ID ="ScriptManager1" runat ="server" >
</ asp:ScriptManager >


< asp:Panel ID ="Panel2" runat ="server" Height ="30px" >
< div style ="padding:5px; cursor: pointer; vertical-align: middle;" >
< div style ="float: left;" > 折叠标题 </ div >
< div style ="float: left; margin-left: 20px;" >< asp:Label ID ="Label1" runat ="server" > (展开...) </ asp:Label ></ div >
< div style ="float: right; vertical-align: middle;" >< asp:Image ID ="Image1"
runat ="server" ImageUrl ="~/images/expand.jpg" /></ div >
</ div >
</ asp:Panel >
< asp:Panel ID ="Panel1" runat ="server" Height ="0" >
< br />
< p >
展开内容
</ p >
</ asp:Panel >
</ div >
< cc1:CollapsiblePanelExtender ID ="cpeDemo" runat ="Server"
TargetControlID ="Panel1"
ExpandControlID ="Panel2"
CollapseControlID ="Panel2"
Collapsed ="True"
TextLabelID ="Label1"
ExpandedText ="(隐藏...)"
CollapsedText ="(展开...)"
ImageControlID ="Image1"
ExpandedImage ="~/images/collapse.jpg"
CollapsedImage ="~/images/expand.jpg"
SuppressPostBack ="true" />

</ form >
</ body >
</ html >