アニメーション中のアクションを無効にする (VB)

作成者: Christian Wenz

PDF のダウンロード

ASP.NET AJAX Control Toolkit の Animation コントロールは、単なるコントロールではなく、コントロールにアニメーションを追加するためのフレームワーク全体です。 また、マウスクリックなどのアクションもサポートしています。 ただし、マウス クリックによってアニメーションが開始される場合は、アニメーション中にマウスクリックを無効にすることが望ましいです。

概要

ASP.NET AJAX Control Toolkit の Animation コントロールは、単なるコントロールではなく、コントロールにアニメーションを追加するためのフレームワーク全体です。 また、マウスクリックなどのアクションもサポートしています。 ただし、マウス クリックによってアニメーションが開始される場合は、アニメーション中にマウスクリックを無効にすることが望ましいです。

手順

まず、ページに ScriptManager を含めます。次に、ASP.NET AJAX ライブラリが読み込まれ、Control Toolkit を使用できるようになります。

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

アニメーションは、次のように HTML ボタンに適用されます。

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

ボタンでポストバックを作成したくないため、Web コントロールの代わりに HTML コントロールが使用されることに注意してください。このコントロールでは、クライアント側のアニメーションが起動されるだけです。

次に AnimationExtender をページに追加し、ID、TargetControlID 属性、必須の runat="server" を追加します。

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

<Animations> ノード内では、<OnClick> はマウス クリックを処理するための適切な要素です。 ただし、アニメーション中にボタンをクリックすることもできます。 <EnableAction> 要素でそれを処理できます。 Enabled="false" を設定すると、アニメーションの一部としてボタンが無効になります。 (ボタンと実際のアニメーションを無効にする) 複数の個別のアニメーションを使用しているため、単一のアニメーションを 1 つに結合するには <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" />

ただし、特定のシナリオでは、ボタンがフェードアウトし、アニメーションの最後に表示されないため、これは役に立ちません。

アニメーションが実行されるとすぐにボタンが無効になります (クリックしてフルサイズの画像を表示します

前へ次へ