The WijTabs control allows you to add animation for transitioning between tabs. Use the ShowOption and HideOption properties to take advantage of this feature.

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. Add a standard Panel control to the main content of  your page.
3. In the panel, add some content for the tabs and tab headers using the following markup:

   <asp:Panel ID="Panel1" runat="server">
   

       <ul>
   

                  <li><a href="#tabs-1">Nunc tincidunt</a></li>
   

                  <li><a href="#tabs-2">Proin dolor</a></li>
   

                  <li><a href="#tabs-3">Aenean lacinia</a></li>
   

            </ul>
   

            <div id="tabs-1">
   

                  <p>
   

                        Proin elit arcu, rutrum commodo, vehicula tempus, commodo a, risus. Curabitur nec
   

                        arcu. Donec sollicitudin mi sit amet mauris. Nam elementum quam ullamcorper ante.
   

                        Etiam aliquet massa et lorem. Mauris dapibus lacus auctor risus. Aenean tempor ullamcorper
   

                        leo. Vivamus sed magna quis ligula eleifend adipiscing. Duis orci. Aliquam sodales
   

                        tortor vitae ipsum. Aliquam nulla. Duis aliquam molestie erat. Ut et mauris vel
   

                        pede varius sollicitudin. Sed ut dolor nec orci tincidunt interdum. Phasellus ipsum.
   

                        Nunc tristique tempus lectus.</p>
   

            </div>
   

            <div id="tabs-2">
   

                  <p>
   

                        Morbi tincidunt, dui sit amet facilisis feugiat, odio metus gravida ante, ut pharetra
   

                        massa metus id nunc. Duis scelerisque molestie turpis. Sed fringilla, massa eget
   

                        luctus malesuada, metus eros molestie lectus, ut tempus eros massa ut dolor. Aenean
   

                        aliquet fringilla sem. Suspendisse sed ligula in ligula suscipit aliquam. Praesent
   

                        in eros vestibulum mi adipiscing adipiscing. Morbi facilisis. Curabitur ornare consequat
   

                        nunc. Aenean vel metus. Ut posuere viverra nulla. Aliquam erat volutpat. Pellentesque
   

                        convallis. Maecenas feugiat, tellus pellentesque pretium posuere, felis lorem euismod
   

                        felis, eu ornare leo nisi vel felis. Mauris consectetur tortor et purus.</p>
   

            </div>
   

            <div id="tabs-3">
   

                  <p>
   

                        Mauris eleifend est et turpis. Duis id erat. Suspendisse potenti. Aliquam vulputate,
   

                        pede vel vehicula accumsan, mi neque rutrum erat, eu congue orci lorem eget lorem.
   

                        Vestibulum non ante. Class aptent taciti sociosqu ad litora torquent per conubia
   

                        nostra, per inceptos himenaeos. Fusce sodales. Quisque eu urna vel enim commodo
   

                        pellentesque. Praesent eu risus hendrerit ligula tempus pretium. Curabitur lorem
   

                        enim, pretium nec, feugiat nec, luctus a, lacus.</p>
   

                  <p>
   

                        Duis cursus. Maecenas ligula eros, blandit nec, pharetra at, semper at, magna. Nullam
   

                        ac lacus. Nulla facilisi. Praesent viverra justo vitae neque. Praesent blandit adipiscing
   

                        velit. Suspendisse potenti. Donec mattis, pede vel pharetra blandit, magna ligula
   

                        faucibus eros, id euismod lacus dolor eget odio. Nam scelerisque. Donec non libero
   

                        sed nulla mattis commodo. Ut sagittis. Donec nisi lectus, feugiat porttitor, tempor
   

                        ac, tempor vitae, pede. Aenean vehicula velit eu tellus interdum rutrum. Maecenas
   

                        commodo. Pellentesque nec elit. Fusce in lacus. Vivamus a libero vitae lectus hendrerit
   

                        hendrerit.</p>
   

            </div>
   

       </asp:Panel>
   

4. In Source view, use the following markup to add a WijTabs control to the page and set the TargetControlID to Panel1.

     <cc1:WijTabs ID="Panel1_WijTabs" runat="server"        
   

           TargetControlID="Panel1">        
   

     </cc1:WijTabs>
   

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_WijTabs.
7. Set the ShowOption properties:

   ShowOption-Blind	True
   ShowOption-Duration	1500
   ShowOption-Fade	True

8. Set the HideOption properties:

   HideOption-Blind	False
   HideOption-Duration	200
   HideOption-Fade	True

   The markup for the WijTabs control should now look similar to the following:

   <cc1:WijTabs ID="Panel1_WijTabs" runat="server"        
   

           TargetControlID="Panel1" ShowOption-Duration="1500" HideOption-Blind="False" HideOption-Duration="200">
   

   </cc1:WijTabs>
   

9. Press F5 to run the application. When you click a tab, the content from the previously selected tab fades quickly, and the content for the selected tab drops down and slowly fades in.