Accordion控件

来源：互联网发布：windows sp2升级sp3 编辑：程序博客网时间：2024/05/29 10:57

Ajax控件之Accordion

Default.aspx

<%@ 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控件之Accordion</title>

</head>

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

<%-- SelectedIndex:默认打开的第一扇,FadeTransitions:淡入淡出的效果,当点击第二个Accrodion时会看到文字和背景色淡入淡出的效果

FadeTransitions ,FramesPerSecond:时间间隔如果设置小话速度会非常快 AutoSize:面板超出位置会在右侧有流动条上下移动,如果设置成null,false会把整个文字全部显示

HeaderCssClass头部ContentCssClass中间内容

--%>

<cc1:Accordion ID="MyAccordion" runat="server" SelectedIndex="0" FadeTransitions="true" FramesPerSecond="40" TransitionDuration ="250" AutoSize="Limit" Height ="300px" Width ="400"

HeaderCssClass ="accordinHeader" ContentCssClass ="accordionContent">

<Panes>

<cc1:AccordionPane ID="AccordionPane1" runat="server" ContentCssClass="" HeaderCssClass="">

</Header>

欢迎访问<asp:HyperLink ID="HyperLink1" runat ="server" NavigateUrl="http://blog.csdn.net/meng1986" Text="文宇博客" />!

</center><br />

Welcome to wenyu'Column<br />

这是我第一次使用期ajax做Accordion <br />

博客地址:http://blog.csdn.net/meng1986<br />

QQ:407504852<br />

</Content>

</cc1:AccordionPane>

<cc1:AccordionPane ID="AccordionPane2" runat="server" ContentCssClass="" HeaderCssClass="">

</Header>

欢迎访问<asp:HyperLink ID="HyperLink2" runat ="server" NavigateUrl="http://blog.csdn.net/meng1986" Text="文宇博客" />!

</center><br />

Welcome to wenyu'Column<br />

这是我第一次使用期ajax做Accordion <br />

博客地址:http://blog.csdn.net/meng1986<br />

QQ:407504852<br />

</Content>

</cc1:AccordionPane>

<cc1:AccordionPane ID="AccordionPane3" runat="server" ContentCssClass="" HeaderCssClass="">

</Header>

欢迎访问<asp:HyperLink ID="HyperLink3" runat ="server" NavigateUrl="http://blog.csdn.net/meng1986" Text="文宇博客" />!

</center><br />

Welcome to wenyu'Column<br />

这是我第一次使用期ajax做Accordion <br />

博客地址:http://blog.csdn.net/meng1986<br />

QQ:407504852<br />

</Content>

</cc1:AccordionPane>

</Panes>

</cc1:Accordion>

</div>

</form>

</body>

</html>

StyleSheet.css

body {

}

.accordinHeader

{

border:1px solid #2F4F4F;

background-color:#A6D0E6;

font-family:@楷体_GB2312;

font-size:10px;

font-weight:bold ;

padding :5px;

margin-top:5px;

}

.accordionContent

{

border:1px dushed #2F4F4F;

background-color:#FFFEDF;

font-family:Arial;

border-top:none;

padding :5px;

padding-top:10px;

}