控件用途:
让某个控件的内容变得可折叠.
常用属性:
TargetControlID:目标控件:要实现折叠/展开控件的ID;
ExpandControlID:一个服务器控件,该控件的作用是:点击该控件即可展开 TargetControlID指定的控件;
CollapseControlID:一个服务器控件,该控件的作用是:点击该控件即可将 TargetControlID指定的控件进行折叠;
通常ExpandControlID和CollapseControlID都指向同一个服务器控件,以上三个控件便可实现基本的折叠功能;
Collapsed:设置目标控件的初始置是"展开"还是"折叠"(true:折叠,false:展开);
用文字表示展开/折叠的状态:(锦上添花功能)
TextLabelID:指定一个Label控件用来显示目标控件当前"展开/折叠"的状态(通常是要展形内容的标题);
ExpandedText:设置 TextLabelID指定的Label控件在展开时显示的文字.例如:"关闭面板";
CollapsedText: 设置TextLabelID指定的Label控件在折叠时显示的文字.例如:"展开面板";
同理以可用图片控件来表示展开/折叠的状态,也有三个控件
ImageControlID:指定一个Image控件用来显示目标控件当前"展开/折叠"的状态;
ExpandedImage:设置TextLabelID指定的Image控件在展开时显示的图片;
CollapsedImage:设置TextLabelID指定的Image控件在折叠时显示的图片;
例子演示:
<asp:ScriptManager ID="ScriptManager1" runat="server"> </asp:ScriptManager>
控制展开/折叠的面板
<asp:Panel ID="Panel1" runat="server" >
<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:ImageButton ID="Image1" runat="server" ImageUrl="~/images/expand_blue.jpg" AlternateText="(展开看详细内容...)"/>
</div>
</div>
</asp:Panel>
目标要展开的面板
<asp:Panel ID="Panel2" runat="server" CssClass="collapsePanel" Height="0">
<br />
<p>
新浪体育讯 北京时间10月9日消息,对于巴蒂尔来说,什么使他整个夏天最为怀念的呢?这位火箭队外线最为重要的防守球员的回答一定让你大吃一惊,他最怀念的竟然是裁判。在一周的训练营结束后,尤其是经历了对抗性训练,他已经对于NBA的裁判新赛季苛刻的判罚做好了准备。
“当你在训练营的时候,你要面对需要那种桀骜不驯的年轻人,他们不断的扯你阻止你并和你卡位,”巴蒂尔说,“这样的情况不会在常规赛中出现,不过这样的经历对于你提前适应常规赛裁判的尺度很有帮助,在训练营里面尺度总是很宽松的。”
</p>
</asp:Panel>
主角登场:CollapsiblePanel
<ajaxToolkit:CollapsiblePanelExtender ID="cpeDemo" runat="Server"
TargetControlID="Panel2"
ExpandControlID="Panel1"
CollapseControlID="Panel1"
Collapsed="True"
TextLabelID="Label1"
ImageControlID="Image1"
ExpandedText="(关闭)"
CollapsedText="(展开)"
ExpandedImage="~/images/collapse_blue.jpg"
CollapsedImage="~/images/expand_blue.jpg"
SuppressPostBack="true"
/>
晚安,明天晚上继续!
让某个控件的内容变得可折叠.
常用属性:
TargetControlID:目标控件:要实现折叠/展开控件的ID;
ExpandControlID:一个服务器控件,该控件的作用是:点击该控件即可展开 TargetControlID指定的控件;
CollapseControlID:一个服务器控件,该控件的作用是:点击该控件即可将 TargetControlID指定的控件进行折叠;
通常ExpandControlID和CollapseControlID都指向同一个服务器控件,以上三个控件便可实现基本的折叠功能;
Collapsed:设置目标控件的初始置是"展开"还是"折叠"(true:折叠,false:展开);
用文字表示展开/折叠的状态:(锦上添花功能)
TextLabelID:指定一个Label控件用来显示目标控件当前"展开/折叠"的状态(通常是要展形内容的标题);
ExpandedText:设置 TextLabelID指定的Label控件在展开时显示的文字.例如:"关闭面板";
CollapsedText: 设置TextLabelID指定的Label控件在折叠时显示的文字.例如:"展开面板";
同理以可用图片控件来表示展开/折叠的状态,也有三个控件
ImageControlID:指定一个Image控件用来显示目标控件当前"展开/折叠"的状态;
ExpandedImage:设置TextLabelID指定的Image控件在展开时显示的图片;
CollapsedImage:设置TextLabelID指定的Image控件在折叠时显示的图片;
例子演示:
<asp:ScriptManager ID="ScriptManager1" runat="server"> </asp:ScriptManager>
控制展开/折叠的面板
<asp:Panel ID="Panel1" runat="server" >
<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:ImageButton ID="Image1" runat="server" ImageUrl="~/images/expand_blue.jpg" AlternateText="(展开看详细内容...)"/>
</div>
</div>
</asp:Panel>
目标要展开的面板
<asp:Panel ID="Panel2" runat="server" CssClass="collapsePanel" Height="0">
<br />
<p>
新浪体育讯 北京时间10月9日消息,对于巴蒂尔来说,什么使他整个夏天最为怀念的呢?这位火箭队外线最为重要的防守球员的回答一定让你大吃一惊,他最怀念的竟然是裁判。在一周的训练营结束后,尤其是经历了对抗性训练,他已经对于NBA的裁判新赛季苛刻的判罚做好了准备。
“当你在训练营的时候,你要面对需要那种桀骜不驯的年轻人,他们不断的扯你阻止你并和你卡位,”巴蒂尔说,“这样的情况不会在常规赛中出现,不过这样的经历对于你提前适应常规赛裁判的尺度很有帮助,在训练营里面尺度总是很宽松的。”
</p>
</asp:Panel>
主角登场:CollapsiblePanel
<ajaxToolkit:CollapsiblePanelExtender ID="cpeDemo" runat="Server"
TargetControlID="Panel2"
ExpandControlID="Panel1"
CollapseControlID="Panel1"
Collapsed="True"
TextLabelID="Label1"
ImageControlID="Image1"
ExpandedText="(关闭)"
CollapsedText="(展开)"
ExpandedImage="~/images/collapse_blue.jpg"
CollapsedImage="~/images/expand_blue.jpg"
SuppressPostBack="true"
/>
晚安,明天晚上继续!