將動畫新增至控制項 (C#)
ASP.NET AJAX Control Toolkit 中的動畫控制項不只是控制項，而是將動畫新增至控制項的整個架構。 本教學課程示範如何設定這類動畫。
概觀
ASP.NET AJAX Control Toolkit 中的動畫控制項不只是控制項，而是將動畫新增至控制項的整個架構。 本教學課程示範如何設定這類動畫。
步驟
第一個步驟是像往常一樣，在頁面中包含 ScriptManager，以便載入 ASP.NET AJAX 資料庫，而且可以使用 Control Toolkit：
<asp:ScriptManager ID="asm" runat="server" />
此案例中的動畫會套用至看起來像這樣的文字面板：
<asp:Panel ID="panelShadow" runat="server" CssClass="panelClass">
ASP.NET AJAX is a free framework for quickly creating a new generation of more efficient,
more interactive and highly-personalized Web experiences that work across all the
most popular browsers.<br />
ASP.NET AJAX is a free framework for quickly creating a new generation of more efficient,
more interactive and highly-personalized Web experiences that work across all the
most popular browsers.<br />
ASP.NET AJAX is a free framework for quickly creating a new generation of more efficient,
more interactive and highly-personalized Web experiences that work across all the
most popular browsers.<br />
</asp:Panel>
面板的相關聯 CSS 類別會定義背景色彩和寬度：
<style type="text/css">
.panelClass {background-color: lime; width: 300px;}
</style>
接下來，我們需要 AnimationExtender。 提供 ID 和一般 runat="server" 之後，必須將 TargetControlID 屬性設定至控制項，以在我們的案例中產生動畫效果，面板：
<ajaxToolkit:AnimationExtender ID="ae" runat="server" TargetControlID="Panel1">
整個動畫會使用 XML 語法以宣告方式套用，遺憾的是 Visual Studio 的 IntelliSense 目前並不完全支援。 根節點是在此節點內的 <Animations>;，允許數個事件來判斷動畫的發生時間：
OnClick(點按滑鼠)OnHoverOut(當滑鼠離開控制項時)OnHoverOver(當滑鼠停留在控制項上，停止OnHoverOut動畫)OnLoad(當載入頁面時)OnMouseOut(當滑鼠離開控制項時)OnMouseOver(當滑鼠停留在控制項上，不停止OnMouseOut動畫)
架構隨附一組動畫，每個動畫都由它自己的 XML 元素表示。 以下是部分選項：
<Color>(改變色彩)<FadeIn>(淡入)<FadeOut>(淡出)<Property>(變更控制項的屬性)<Pulse>(閃爍)<Resize>(變更大小)<Scale>(按比例變更大小)
在此範例中，面板應該淡出。動畫應該為 1.5 秒 (Duration 屬性)，顯示每秒 24 個畫面格 (動畫步驟) (Fps 屬性)。 以下是控制項的完整標記 AnimationExtender：
<ajaxToolkit:AnimationExtender ID="ae" runat="server" TargetControlID="Panel1">
<Animations>
<OnLoad>
<FadeOut Duration="1.5" Fps="24" />
</OnLoad>
</Animations>
</ajaxToolkit:AnimationExtender>
當您執行此指令碼時，會顯示面板並在一秒半內淡出。
面板正在淡出 (點按以檢視完整大小的影像)
