Hi
Accordion is a web control that is used to display multiple
panel with one panel visible at a time. Its like have many collapsible panel where only one is visible at
a time. The Accordion is a web control and has accordion pane. Each pane can
have its header and content. This control also remembers its state during the
post back. To fit the variety of layouts its support 3 auto size modes (None,
Limit and full).
The control also support being data bound with its
datasource and databind methods.
The code to use the Accordion looks like this.
<atlasToolkit:Accordion
ID="MyAccordion"
runat="Server"
SelectedIndex="0"
HeaderCssClass="accordionHeader"
ContentCssClass="accordionContent"
AutoSize="None">
FadeTransitions="true"
TransitionDuration="250"
FramesPerSecond="40"
<Panes>
<atlasToolkit:AccordionPane
HeaderCssClass="accordionHeader"
ContentCssClass="accordionContent">
<Header> . . . </Header>
<Content> . . . </Content>
</atlasToolkit:AccordionPane>
<atlasToolkit:AccordionPane
HeaderCssClass="accordionHeader"
ContentCssClass="accordionContent">
<Header> . . . </Header>
<Content> . . . </Content>
</atlasToolkit:AccordionPane>
</Panes>
<HeaderTemplate>...</HeaderTemplate>
<ContentTemplate>...</ContentTemplate>
</atlasToolkit:Accordion>
Here the selected index is the index of the panel, which will be
visible initially. HeaderCSS and the contentCSS are the CSS class to be applied to
eth content and header panel. This is applied to all the panels as default or
can be applied to each panel individually. The autosize property restricts the
growth of accordion control the values can be (None, Limit and full). The fade transition
property defines if there will be fade transition effect or not. TransitionDuration
is the number is number id millisecond for the trasition and FramesPerSecond
defines the number of frames to be used in the transition per second. The Header
and content
template are the template is the template to be used for displaying the header
and content in the control.
Hope this helps
Thanks
Vikram