icon-1    icon-1    icon-1      

ROCA Fitness Photo Gallery

The control above is initialized with this code. The italic properties are optional:

<ajaxToolkit:Accordion
    ID="MyAccordion"
    runat="Server"
    SelectedIndex="0"
    HeaderCssClass="accordionHeader"
    HeaderSelectedCssClass="accordionHeaderSelected"
    ContentCssClass="accordionContent"
    AutoSize="None"
    FadeTransitions="true"
    TransitionDuration="250"
    FramesPerSecond="40"
    RequireOpenedPane="false"
    SuppressHeaderPostbacks="true">
    <Panes>
        <ajaxToolkit:AccordionPane
            HeaderCssClass="accordionHeader"
            HeaderSelectedCssClass="accordionHeaderSelected"
            ContentCssClass="accordionContent">
            <Header> . . . </Header>
            <Content> . . . </Content>
        </ajaxToolkit:AccordionPane>        
        .
        .
        .
    </Panes>            
    <HeaderTemplate>...</HeaderTemplate>
    <ContentTemplate>...</ContentTemplate>
</ajaxToolkit:Accordion>
  • SelectedIndex - The AccordionPane to be initially visible
  • HeaderCssClass - Name of the CSS class to use for the headers. This can be either applied to the Accordion as a default for all AccordionPanes, or an individual AccordionPane.
  • HeaderSelectedCssClass - Name of the CSS class to use for the selected header. This can be either applied to the Accordion as a default for all AccordionPanes, or an individual AccordionPane.
  • ContentCssClass - Name of the CSS class to use for the content. This can be either applied to the Accordion as a default for all AccordionPanes, or an individual AccordionPane.
  • FadeTransitions - True to use the fading transition effect, false for standard transitions.
  • TransitionDuration - Number of milliseconds to animate the transitions
  • FramesPerSecond - Number of frames per second used in the transition animations
  • AutoSize - Restrict the growth of the Accordion. The values of the AutoSize enumeration are described above.
  • RequireOpenedPane - Prevent closing the currently opened pane when its header is clicked (which ensures one pane is always open). The default value is true.
  • SuppressHeaderPostbacks - Prevent the client-side click handlers of elements inside a header from firing (this is especially useful when you want to include hyperlinks in your headers for accessibility)
  • Panes - Collection of AccordionPane controls
  • HeaderTemplate - The Header template contains the markup that should be used for an pane's header when databinding
  • ContentTemplate - The Content template contains the markup that should be used for a pane's content when databinding
  • DataSource - The data source to use. DataBind() must be called.
  • DataSourceID - The ID of the data source to use.
  • DataMember - The member to bind to when using a DataSourceID