<ajaxToolkit:AnimationExtender id="OpenAnimation" runat="server" TargetControlID="btnInfo">
<Animations>
    <OnClick>
        <Sequence>
           <%-- Disable the button --%>
            <EnableAction Enabled="false" /> 
           <%-- Show the flyout --%>
            <Parallel AnimationTarget="flyout" Duration=".3" Fps="25">
                <Move Horizontal="150" Vertical="-50" />
                <Resize Height="260" Width="280" />
                <Color AnimationTarget="flyout" PropertyKey="backgroundColor"
                        StartValue="#AAAAAA" EndValue="#FFFFFF" />
            </Parallel>
          <%-- Fade in the text --%> 
            <FadeIn AnimationTarget="info" Duration=".2"/>
          <%-- Cycle the text and border color to red and back --%>
            <Parallel AnimationTarget="info" Duration=".5">
                <Color PropertyKey="color"
                        StartValue="#666666" EndValue="#FF0000" />
                <Color PropertyKey="borderColor"
                        StartValue="#666666" EndValue="#FF0000" />
            </Parallel>
            <Parallel AnimationTarget="info" Duration=".5">
                <Color PropertyKey="color"
                        StartValue="#FF0000" EndValue="#666666" />
                <Color PropertyKey="borderColor"
                        StartValue="#FF0000" EndValue="#666666" />
                <FadeIn AnimationTarget="btnCloseParent" MaximumOpacity=".9" />
            </Parallel>
        </Sequence>
    </OnClick>
</Animations>
</ajaxToolkit:AnimationExtender>

<ajaxToolkit:AnimationExtender id="CloseAnimation" runat="server" TargetControlID="btnClose">
<Animations>
    <OnClick>
        <Sequence AnimationTarget="info">
          <%-- Scale the flyout down to 5% to make it disappear --%>
            <Parallel Duration=".3" Fps="15">
                <Scale ScaleFactor="0.05" Center="true"
                        ScaleFont="true" FontUnit="px" />
                <FadeOut />
            </Parallel>
          <%-- Reset the styles on the info box --%>
            <StyleAction Attribute="display" Value="none"/>
            <StyleAction Attribute="width" Value="250px"/>
            <StyleAction Attribute="height" Value=""/>
            <StyleAction Attribute="fontSize" Value="12px"/>
          <%-- Re-enable the button --%>
            <EnableAction Enabled="true"
                    AnimationTarget="btnInfo" />
        </Sequence>
    </OnClick>
</Animations>
</ajaxToolkit:AnimationExtender>