How to make fade out animation effect in using Ajax AnimationExtender Control?

In This post I will expalin how to use animation effect using Ajax AnimationExtender control in

The source page of the code is:

<html xmlns=””>

<head runat=”server”>

<title>AnimationExtender control Example</title>

<style type=”text/css”>






border:2px black;






<form id=”form1″ runat=”server”>


<asp:ToolkitScriptManager runat=”server”>



target control for making fade out animation effect

<asp:Panel ID=”p1″ runat=”server” CssClass=”c1″>

I am going to fade out!

<asp:LinkButton ID=”lb1″ runat=”server” OnClientClick=”return false;”>FadeOut </asp:LinkButton>


<asp:AnimationExtender ID=”ae1″ runat=”server” TargetControlID=”p1″>



<FadeOut Duration=”10″ Fps=”40″></FadeOut>








Check out Best Alternative to InfoPath -> Try Now

You May Also like the Following SharePoint Online Tutorials:

About Bijay Kumar

I am Bijay from Odisha, India. Currently working in my own venture TSInfo Technologies in Bangalore, India. I am Microsoft Office Servers and Services (SharePoint) MVP (5 times). I works in SharePoint 2016/2013/2010, SharePoint Online Office 365 etc. Check out My MVP Profile.. I also run popular SharePoint web site

View all posts by Bijay Kumar →