微软的AJAX控件学习一:AccordionDemo

这个控件其实就和以前的Atlas和现在的Ajax的CollapsiblePanel这个控件的作用差不多的,这两个应用的场合有些不同:
 Accordion应用在存在多个Panel而且一次只显示一个Panel 的时候;
CollapsiblePanel呢只能控制一个Panel的显示和隐藏;
下面做一个Accordion的例子代码:
 1      < div >
 2          < div >
 3         在一个面板里面链接显示或隐藏我们想显示和隐藏的
 4          </ div >
 5          < br  />
 6          < asp:ScriptManager ID = " ScriptManager1 "  runat = " server " >
 7          </ asp:ScriptManager >       
 8           < cc1:Accordion
 9             ID = " MyAccordion "  
10             runat = " server "  SelectedIndex = " 0 "    
11             FadeTransitions = " true "              
12             FramesPerSecond = " 80 "
13             TransitionDuration = " 80 "
14             AutoSize = " None "  
15             RequireOpenedPane = " false "  
16             SuppressHeaderPostbacks = " true " >
17             < Panes >
18              < cc1:AccordionPane ID = " AccordionPane1 "  runat = " server " >
19                  < Header >< a href = ""   class = " accordionLink " > ·中国 </ a ></ Header >
20                  < Content >
21                  < div style = " background-color:ThreeDShadow " >
22                    中国我晓得 < br  />
23                    你呢?
24                  </ div ></ Content >
25              </ cc1:AccordionPane >
26              < cc1:AccordionPane ID = " AccordionPane2 "  runat = " server " >
27                  < Header >< a href = ""   class = " accordionLink " >< br /> 美国 </ a ></ Header >
28                  < Content >
29                   美国我讨厌 
30                    < br  />
31                   and you  ?
32                  </ Content >
33              </ cc1:AccordionPane >
34              < cc1:AccordionPane ID = " AccordionPane3 "  runat = " server " >
35                  < Header >< a href = ""   class = " accordionLink " >< br  /> 日本 </ a ></ Header >
36                  < Content >
37                   日本我憎恨
38                    < br  />
39                   Agree with me ??
40                  </ Content >
41              </ cc1:AccordionPane >
42              < cc1:AccordionPane ID = " AccordionPane4 "  runat = " server " >
43                  < Header >< a href = ""   class = " accordionLink " >< br  /> 韩国 </ a ></ Header >
44                  < Content >
45                     我羡慕,美女帅哥太多打,呵呵
46         
47                  </ Content >
48              </ cc1:AccordionPane >
49              </ Panes >
50          </ cc1:Accordion >
51          </ div >

这样啊,比较简单啊,主要就是Accordion的几个属性的设置 ,有些观点都是我个人的见解哦,有什么不对之处还请更正,TKS~~~~~~

你可能感兴趣的:(accordion)