The WijAccordion control supports animation. Simply set the Animated Effect property to take advantage of this feature.

<cc1:WijAccordion ID="Panel1_WijAccordion" runat="server"

        TargetControlID="Panel1">

        <Animated Effect="easeInOutCirc" />

</cc1:WijAccordion>

1. Create an ASP.NET Web application with a ScriptManager control and install Juice UI and the Wijmo Juice libraries to your project via NuGet.
2. While in Design view of your Web application, navigate to the Visual Studio Toolbox and double-click the Panel control to add a panel to the main content of  your page.
3. Add some content to the panel within the <asp:Panel> tags. For example:

   	Copy Code
   <asp:Panel ID="Panel1" runat="server"> <h3>Pane 1</h3> <div> <p> Pane 1 content here. </p> </div> <h3>Pane 2</h3> <div> <p> Pane 2 content here. </p> </div> <h3> Pane 3</h3> <div> <p> Pane 3 content here. </p> </div> <h3> Pane 4</h3> <div> <p> Pane 4content here. </p> </div></asp:Panel>

4. While still in Source view, use the following markup to add a WijAccordion control to the page and set the TargetControlID to Panel1.

   	Copy Code
   <cc1:WijAccordion ID="Panel1_WijAccordion" runat="server" TargetControlID="Panel1"> </cc1:WijAccordion>

5. Select View | Properties Window in the Visual Studio menu.
6. Click the drop-down list at the top of the Properties window and select Panel1_WijAccordion.
7. Expand the Animated property and enter an animation effect next to the Effect property.