繪製 UpdatePanel 控制項的動畫 (C#)
ASP.NET AJAX Control Toolkit 中的動畫控制項不只是控制項，而是將動畫新增至控制項的整個架構。 對於 UpdatePanel 的內容，有一個特別擴充項，高度依賴動畫架構：UpdatePanelAnimation。 本教學課程示範如何針對 UpdatePanel 設定這類動畫。
概觀
ASP.NET AJAX Control Toolkit 中的動畫控制項不只是控制項，而是將動畫新增至控制項的整個架構。 對於 UpdatePanel 的內容，有一個特別擴充項，高度依賴動畫架構：UpdatePanelAnimation。 本教學課程示範如何針對 UpdatePanel 設定這類動畫。
步驟
第一個步驟是像往常一樣，在頁面中包含 ScriptManager，以便載入 ASP.NET AJAX 資料庫，而且可以使用 Control Toolkit：
<asp:ScriptManager ID="asm" runat="server" />
此案例中的動畫會套用至 ASP.NET Wizard 網頁控制項，其位於 UpdatePanel 中。 三個 (任意) 步驟提供足夠的選項來觸發回傳：
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:Wizard ID="Wizard1" runat="server">
<WizardSteps>
<asp:WizardStep runat="server" StepType="Start" Title="Ready!">
</asp:WizardStep>
<asp:WizardStep runat="server" StepType="Step" Title="Set!">
</asp:WizardStep>
<asp:WizardStep runat="server" StepType="Finish" Title="Go!">
</asp:WizardStep>
</WizardSteps>
</asp:Wizard>
</ContentTemplate>
</asp:UpdatePanel>
UpdatePanelAnimationExtender 控制項所必要的標記與用於 AnimationExtender 的標記相當類似。 在 TargetControlID 屬性中，我們會提供 UpdatePanel 的 ID 來產生動畫效果；在 UpdatePanelAnimationExtender 控制項內，<Animations> 元素會保存動畫的 XML 標記。 不過有一個差異：相較於 AnimationExtender，事件和事件處理程式的數量會受到限制。 針對 UpdatePanels，其中只有兩個存在：
<OnUpdated>更新 UpdatePanel 時<OnUpdating>UpdatePanel 開始更新時
在此案例中，UpdatePanel 的新內容 (回傳後) 應淡入。 這是執行該動作的必要標記：
<ajaxToolkit:UpdatePanelAnimationExtender ID="upae" runat="server"
TargetControlID="UpdatePanel1">
<Animations>
<OnUpdated>
<FadeIn Duration="1.0" Fps="24" />
</OnUpdated>
</Animations>
</ajaxToolkit:UpdatePanelAnimationExtender>
現在每當 UpdatePanel 內發生回傳時，面板的新內容就會順暢地淡入。
下一個精靈步驟即將淡出 (點按以檢視完整大小的影像)
