AjaxControlToolKit 学习之:Accordion
Accordion控件
效果:若干折叠式DIV,每次只显示一个DIV
功能:适合用来做导航等节省页面空间的应用
实现:
1.固定项的Accordion控件,不需要任何服务器端代码或js
<ajaxToolkit:Accordion ID="Accordion1" runat="server" ContentCssClass="accordionContent"
HeaderCssClass="accordionHeader" AutoSize="Limit" >
<Panes >
<ajaxToolkit:AccordionPane ID="AccordionPane1" runat="server" >
<Header><a class="accordionLink" href ="#">1.这个区域一</a></Header>
<Content >Accordion控件主要用来重合放置若干<br />容器,进行切换显示</Content>
</ajaxToolkit:AccordionPane>
<ajaxToolkit:AccordionPane ID="AccordionPane2" runat="server">
<Header><a class="accordionLink" href ="#">2.这个区域二</a></Header>
<Content >可以用来制作导航栏</Content>
</ajaxToolkit:AccordionPane>
<ajaxToolkit:AccordionPane ID="AccordionPane3" runat="server">
<Header><a class="accordionLink" href ="#">3.这个区域三</a></Header>
<Content >================</Content>
</ajaxToolkit:AccordionPane>
</Panes>
</ajaxToolkit:Accordion>
2.动态生成项的Accordion控件
效果:若干折叠式DIV,每次只显示一个DIV
功能:适合用来做导航等节省页面空间的应用
实现:
1.固定项的Accordion控件,不需要任何服务器端代码或js
![](/Images/OutliningIndicators/None.gif)
![](/Images/OutliningIndicators/None.gif)
![](/Images/OutliningIndicators/None.gif)
![](/Images/OutliningIndicators/None.gif)
![](/Images/OutliningIndicators/None.gif)
![](/Images/OutliningIndicators/None.gif)
![](/Images/OutliningIndicators/None.gif)
![](/Images/OutliningIndicators/None.gif)
![](/Images/OutliningIndicators/None.gif)
![](/Images/OutliningIndicators/None.gif)
![](/Images/OutliningIndicators/None.gif)
![](/Images/OutliningIndicators/None.gif)
![](/Images/OutliningIndicators/None.gif)
![](/Images/OutliningIndicators/None.gif)
![](/Images/OutliningIndicators/None.gif)
![](/Images/OutliningIndicators/None.gif)
![](/Images/OutliningIndicators/None.gif)
![](/Images/OutliningIndicators/None.gif)