動畫播放期間停用動作 (C#)

作者 :擷取 Wenz

下載 PDF

ASP.NET AJAX 控制項工具組中的動畫控制項不只是控制項,也是將動畫新增至控制項的整個架構。 它也支援動作,例如按一下滑鼠。 不過,當滑鼠按一下開始動畫時,建議您在動畫期間停用滑鼠點擊。

概觀

ASP.NET AJAX 控制項工具組中的動畫控制項不只是控制項,也是將動畫新增至控制項的整個架構。 它也支援動作,例如按一下滑鼠。 不過,當滑鼠按一下開始動畫時,建議您在動畫期間停用滑鼠點擊。

步驟

首先,在頁面中包含 ScriptManager ,然後載入 ASP.NET AJAX 程式庫,讓您可以使用 Control Toolkit:

<asp:ScriptManager ID="asm" runat="server" />

動畫會套用至 HTML 按鈕,如下所示:

<input type="button" ID="Button1" runat="server" Value="Launch Animation" />

請注意,會使用 HTML 控制項,而不是 Web 控制項,因為我們不想讓按鈕建立回傳;它應該只會為我們啟動用戶端動畫。

然後,將 新增 AnimationExtender 至頁面,並提供 ID 、屬性 TargetControlID 和強制 runat="server"

<ajaxToolkit:AnimationExtender ID="ae" runat="server" TargetControlID="Button1">

在節點中 <Animations><OnClick> 是處理滑鼠按一下的右邊元素。 不過,您也可以在動畫期間按一下按鈕。 元素 <EnableAction> 可以處理該專案。 設定 Enabled="false" 會將按鈕停用為動畫的一部分。 由於我們使用數個個別動畫 (停用按鈕和實際動畫) ,因此 <Parallel> 需要元素將單一動畫黏附在一個動畫中。 以下是 的完整標記 AnimationExtender

<ajaxToolkit:AnimationExtender ID="ae" runat="server" TargetControlID="Button1">
 <Animations>
 <OnClick>
 <Parallel>
 <EnableAction Enabled="false" />
 <FadeOut Duration="1.5" Fps="24" />
 <Resize Width="1000" Height="150" Unit="px" />
 </Parallel>
 </OnClick>
 </Animations>
</ajaxToolkit:AnimationExtender>

您也可以使用清單結尾的下列 XML 元素,在動畫之後重新啟用按鈕:

<EnableAction Enabled="true" />

不過,在給定的案例中,由於按鈕淡出且不會顯示在動畫結尾,所以不會使用。

動畫執行時,按鈕會立即停用

一旦動畫執行 (按一下即可檢視完整大小的影像) ,就會停用按鈕