先日、新バージョンがリリースされた ASP.NET AJAX Control Toolkit ですが、いくつかのエクステンダでアニメーション効果を付加することができるようになっています。
例えば、下図
の ValidatorCalloutExtender では、次のように ValidatorCalloutExtender 要素の子要素として Animations 要素を追加して、AnimationExtender と同じ記述ができるようになっています。
<asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server"
ControlToValidate="TextBox1"
ErrorMessage="<b>名前が未入力です。</b><br /><br />名前を入力してください。"
Display="None">
</asp:RequiredFieldValidator>
<ajaxToolkit:ValidatorCalloutExtender ID="ValidatorCalloutExtender1"
runat="server"
TargetControlID="RequiredFieldValidator1"
HighlightCssClass="Highlight">
<Animations>
<OnShow>
<Sequence>
<HideAction Visible="true" />
<Pulse Duration=".1" Iterations="2" />
</Sequence>
</OnShow>
<OnHide>
<Sequence>
<FadeOut Duration=".1" />
</Sequence>
</OnHide>
</Animations>
</ajaxToolkit:ValidatorCalloutExtender>
この場合は、図ではわかりませんが、ValidatorCallout による検証メッセージの表示時にポップアップを２回点滅させています。そしてポップアップが非表示になるときにはフェード効果を付加しています。
このようなアニメーション効果の機能が追加されたコントロールには、次のものがあるようです。
- AutoCompleteExtender
- DropDownExtender
- HoverMenuExtender
- ListSearchExtender
- PopupControlExtender
- ValidatorCalloutExtender
とりあえず、AutoCompleteExtender でのアニメーション効果は
http://ajax.asp.net/ajaxtoolkit/AutoComplete/AutoComplete.aspx
で確認できます。
お試しあれ。