Ajax Animation Extender

Animation Extender

Animation Extender is used to create animations for the controls on that page. It has the property target control ID to specify the id of the control to which you want to apply the animation using this animation Extender. IT has the property animation to specify the list of animations you want to apply for the target control. Example The following example demonstrates how to use Animation Extender to create Animations. Add a page to the website and take a Toolkit script manger & a panel on the page and within the panel provide any content you want. Within HTML source of the page drag & drop an animation Extender & create the required animations for the panel by setting the panel as target control as follows. <asp:Animation Extender ID=”Animation Extender1” runat=”server” TargetcontrolID=”panel1”> <Animations> <onLoad> <Fadeout Duration = “0.5” minimum opacity =”0.3”/> </onLoad> <onmouseover> <> <parallel> <Fadein Duration = “0.5”> <color property key=”background”> start value=”#FFFFFF” Endvalue=”#FFFF00” duration =”0.5” /> </parallel> <onmouseover> <parallel> <Fadeout Duration = “0.5” minimum opacity=”0.3” /> <color property key=”background” startvalue=”#FFFF00” Endvalue=”#FFFFFF” Duration = “0.5” /> </parallel> </onmouseout> </animations> </asp:Animation Extender> When you run the page then immediately after the panel is loaded it will be fade out and whenever mousepointer placed over the panel then the panel become fade in and also the background of the panel will be changed from white to yellow and whenever you move the mouse pointer out of the panel then the panel with the fade out and at the same time the background of the panel will be changed from yellow to white.  

3)