AJAX控件之CollapsiblePanel

效果图对比:

资源文件 :

显示页面的Html代码:

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

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

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<title>AJAX控件之CollapsiblePanel</title>

</head>

<asp:ScriptManager ID="ScriptManager1" runat="server" />

<div>

<asp:Panel ID="Panel1" runat="server" Height="30px" Width="275px">

<div style="font-weight: bold; background-image: url(images/bg.png); width: 275px;

color: #ffffff; height: 30px">

4月1日愚人节快乐<asp:Label ID="Label1" runat="server" Text="收缩"></asp:Label>

<asp:Image ID="Image1" runat="server" ImageUrl="~/images/expand.jpg" /></div>

</asp:Panel>

</div>

<asp:Panel ID="Panel2" runat="server" Height="104px" Width="275px">

<asp:Image ID="Image2" runat="server" Height="120px" ImageUrl="~/images/AJAX.gif"

Width="100%" /><br />

http://chenou.cnblogs.com</asp:Panel>

<cc1:CollapsiblePanelExtender ID="CollapsiblePanelExtender1" runat="server" CollapseControlID="Panel1"

CollapsedImage="~/images/expand.jpg" CollapsedText="扩展" ExpandControlID="Panel1"

ExpandedImage="~/images/collapse.jpg" ExpandedText="收缩" ImageControlID="Image1"

SuppressPostBack="True" TargetControlID="Panel2" TextLabelID="Label1">

</cc1:CollapsiblePanelExtender>

</form>

</body>

</html>

posted on 2007-04-01 22:17 小角色阅读(198) 评论(0) 收藏举报