Accordion用法
View Code
<%@ Page Language="C#" MasterPageFile="~/site.master" AutoEventWireup="true" CodeFile="TaskTest.aspx.cs" Inherits="TaskTest" %>
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>
<asp:Content ID="Content1" runat="server" ContentPlaceHolderID =ContentPlaceHolder1>
<style type="text/css">
#menu ul{
padding: 0px;
margin: 0px;
text-align: left;
list-style-type:none
}
#menu li{
padding: 0px;
margin: 0px;
text-align: left;
list-style-type:none
}
.submenu
{
line-height:20px;
border:solid 1px red;
text-align:center;
font-size:14px;
width:111px;
}
</style>
<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
<div class="main">
<div class="left">
<asp:UpdatePanel ID="upMenu" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<cc1:Accordion ID="MyAccordion" runat="server" SelectedIndex="0" HeaderCssClass="accordionHeader"
HeaderSelectedCssClass="accordionHeaderSelected" ContentCssClass="accordionContent"
FadeTransitions="false" FramesPerSecond="40" TransitionDuration="250" AutoSize="None"
RequireOpenedPane="false" SuppressHeaderPostbacks="true">
<Panes>
<cc1:AccordionPane ID="AccordionPane1" runat="server">
<Header>
<a href="javascript:;" class="accordionLink"><div class="leftTitle"> 菜单列表一 </div></a></Header>
<Content>
<ul>
<li>
<asp:LinkButton ID="LinkButton1" OnClick="MenuItem_Click" runat="server">LinkButton</asp:LinkButton></li>
<li>
<asp:LinkButton ID="LinkButton2" OnClick="MenuItem_Click" runat="server">LinkButton</asp:LinkButton></li>
<li>
<asp:LinkButton ID="LinkButton3" OnClick="MenuItem_Click" runat="server">LinkButton</asp:LinkButton></li>
<li>
<asp:LinkButton ID="LinkButton4" OnClick="MenuItem_Click" runat="server">LinkButton</asp:LinkButton></li>
</ul>
</Content>
</cc1:AccordionPane>
<cc1:AccordionPane ID="AccordionPane2" runat="server">
<Header>
<a href="javascript:;" class="accordionLink"><div class="leftTitle">菜单列表二</div></a></Header>
<Content>
<div>
<asp:LinkButton ID="LinkButton5" OnClick="MenuItem_Click" runat="server">LinkButton</asp:LinkButton></div>
<div>
<asp:LinkButton ID="LinkButton6" OnClick="MenuItem_Click" runat="server">LinkButton</asp:LinkButton></div>
<div>
<asp:LinkButton ID="LinkButton7" OnClick="MenuItem_Click" runat="server">LinkButton</asp:LinkButton></div>
<div>
<asp:LinkButton ID="LinkButton8" OnClick="MenuItem_Click" runat="server">LinkButton</asp:LinkButton></div>
</Content>
</cc1:AccordionPane>
<cc1:AccordionPane ID="AccordionPane3" runat="server">
<Header>
<a href="javascript:;" class="accordionLink"><div class="leftTitle">菜单列表三</div></a></Header>
<Content>
<ul>
<li>
<asp:LinkButton ID="LinkButton9" OnClick="MenuItem_Click" PostBackUrl="~/Default.aspx?menuid=1"
runat="server">LinkButton</asp:LinkButton></li>
<li>
<asp:LinkButton ID="LinkButton10" OnClick="MenuItem_Click" PostBackUrl="~/Default.aspx?menuid=2"
runat="server">LinkButton</asp:LinkButton></li>
<li>
<asp:LinkButton ID="LinkButton11" OnClick="MenuItem_Click" PostBackUrl="~/Default.aspx?menuid=3"
runat="server">LinkButton</asp:LinkButton></li>
<li>
<asp:LinkButton ID="LinkButton12" OnClick="MenuItem_Click" PostBackUrl="~/Default.aspx?menuid=4"
runat="server">LinkButton</asp:LinkButton></li>
</ul>
</Content>
</cc1:AccordionPane>
<cc1:AccordionPane ID="AccordionPane4" runat="server">
<Header>
<a href="javascript:;" class="accordionLink"><div class="leftTitle">菜单列表四</div></a></Header>
<Content>
<ul>
<li>
<asp:LinkButton ID="LinkButton13" OnClick="MenuItem_Click" PostBackUrl="~/Default2.aspx?menuid=1"
runat="server">LinkButton</asp:LinkButton></li>
<li>
<asp:LinkButton ID="LinkButton14" OnClick="MenuItem_Click" PostBackUrl="~/Default2.aspx?menuid=2"
runat="server">LinkButton</asp:LinkButton></li>
<li>
<asp:LinkButton ID="LinkButton15" OnClick="MenuItem_Click" PostBackUrl="~/Default2.aspx?menuid=3"
runat="server">LinkButton</asp:LinkButton></li>
</ul>
</Content>
</cc1:AccordionPane>
</Panes>
</cc1:Accordion>
</ContentTemplate>
</asp:UpdatePanel>
</div>
<div class="right"></div>
</div>
</asp:Content>
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>
<asp:Content ID="Content1" runat="server" ContentPlaceHolderID =ContentPlaceHolder1>
<style type="text/css">
#menu ul{
padding: 0px;
margin: 0px;
text-align: left;
list-style-type:none
}
#menu li{
padding: 0px;
margin: 0px;
text-align: left;
list-style-type:none
}
.submenu
{
line-height:20px;
border:solid 1px red;
text-align:center;
font-size:14px;
width:111px;
}
</style>
<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
<div class="main">
<div class="left">
<asp:UpdatePanel ID="upMenu" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<cc1:Accordion ID="MyAccordion" runat="server" SelectedIndex="0" HeaderCssClass="accordionHeader"
HeaderSelectedCssClass="accordionHeaderSelected" ContentCssClass="accordionContent"
FadeTransitions="false" FramesPerSecond="40" TransitionDuration="250" AutoSize="None"
RequireOpenedPane="false" SuppressHeaderPostbacks="true">
<Panes>
<cc1:AccordionPane ID="AccordionPane1" runat="server">
<Header>
<a href="javascript:;" class="accordionLink"><div class="leftTitle"> 菜单列表一 </div></a></Header>
<Content>
<ul>
<li>
<asp:LinkButton ID="LinkButton1" OnClick="MenuItem_Click" runat="server">LinkButton</asp:LinkButton></li>
<li>
<asp:LinkButton ID="LinkButton2" OnClick="MenuItem_Click" runat="server">LinkButton</asp:LinkButton></li>
<li>
<asp:LinkButton ID="LinkButton3" OnClick="MenuItem_Click" runat="server">LinkButton</asp:LinkButton></li>
<li>
<asp:LinkButton ID="LinkButton4" OnClick="MenuItem_Click" runat="server">LinkButton</asp:LinkButton></li>
</ul>
</Content>
</cc1:AccordionPane>
<cc1:AccordionPane ID="AccordionPane2" runat="server">
<Header>
<a href="javascript:;" class="accordionLink"><div class="leftTitle">菜单列表二</div></a></Header>
<Content>
<div>
<asp:LinkButton ID="LinkButton5" OnClick="MenuItem_Click" runat="server">LinkButton</asp:LinkButton></div>
<div>
<asp:LinkButton ID="LinkButton6" OnClick="MenuItem_Click" runat="server">LinkButton</asp:LinkButton></div>
<div>
<asp:LinkButton ID="LinkButton7" OnClick="MenuItem_Click" runat="server">LinkButton</asp:LinkButton></div>
<div>
<asp:LinkButton ID="LinkButton8" OnClick="MenuItem_Click" runat="server">LinkButton</asp:LinkButton></div>
</Content>
</cc1:AccordionPane>
<cc1:AccordionPane ID="AccordionPane3" runat="server">
<Header>
<a href="javascript:;" class="accordionLink"><div class="leftTitle">菜单列表三</div></a></Header>
<Content>
<ul>
<li>
<asp:LinkButton ID="LinkButton9" OnClick="MenuItem_Click" PostBackUrl="~/Default.aspx?menuid=1"
runat="server">LinkButton</asp:LinkButton></li>
<li>
<asp:LinkButton ID="LinkButton10" OnClick="MenuItem_Click" PostBackUrl="~/Default.aspx?menuid=2"
runat="server">LinkButton</asp:LinkButton></li>
<li>
<asp:LinkButton ID="LinkButton11" OnClick="MenuItem_Click" PostBackUrl="~/Default.aspx?menuid=3"
runat="server">LinkButton</asp:LinkButton></li>
<li>
<asp:LinkButton ID="LinkButton12" OnClick="MenuItem_Click" PostBackUrl="~/Default.aspx?menuid=4"
runat="server">LinkButton</asp:LinkButton></li>
</ul>
</Content>
</cc1:AccordionPane>
<cc1:AccordionPane ID="AccordionPane4" runat="server">
<Header>
<a href="javascript:;" class="accordionLink"><div class="leftTitle">菜单列表四</div></a></Header>
<Content>
<ul>
<li>
<asp:LinkButton ID="LinkButton13" OnClick="MenuItem_Click" PostBackUrl="~/Default2.aspx?menuid=1"
runat="server">LinkButton</asp:LinkButton></li>
<li>
<asp:LinkButton ID="LinkButton14" OnClick="MenuItem_Click" PostBackUrl="~/Default2.aspx?menuid=2"
runat="server">LinkButton</asp:LinkButton></li>
<li>
<asp:LinkButton ID="LinkButton15" OnClick="MenuItem_Click" PostBackUrl="~/Default2.aspx?menuid=3"
runat="server">LinkButton</asp:LinkButton></li>
</ul>
</Content>
</cc1:AccordionPane>
</Panes>
</cc1:Accordion>
</ContentTemplate>
</asp:UpdatePanel>
</div>
<div class="right"></div>
</div>
</asp:Content>
-------此处无银三百两------