AJAX Toolkit中AnimationExtender控件学习

最新推荐文章于 2025-08-16 06:08:09 发布

原创最新推荐文章于 2025-08-16 06:08:09 发布 · 902 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#ajax #server #parallel #button #textbox #assembly

ASP.NET AJAX 专栏收录该内容

2 篇文章

订阅专栏

本文介绍了ASP.NET AJAX AnimationExtender控件的使用方法，包括可用事件、动画动作及方法，并通过一个示例展示了如何实现文本标签的缩放效果。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

AnimationExtender中可以使用的事件如下：

            1.OnClick
            2.OnHoverOver
            3.OnHoverOut
            4.OnLoad
            5.OnMouseOver
            6.OnMouseOut

以上事件不做一一解释，都应该明白。

AnimationExtender动画动作如下：

·<Fade>：使元素淡入淡出界面

·<FadeIn>：使元素淡入界面

·<FadeOut>：使元素淡出界面

·<Pulse>：使元素有规律的方式淡入淡出

·<Color>：把元素的颜色从色谱的一个位置变换到另一个位置

·<Move>：移动页面上的元素

·<Resize>：把元素的大小重置为另一尺寸

·<Scale>：以指定的缩放比例缩放一个元素

AnimationExtender动画方法如下：

·<Case>：根据特定的情况应用动画。类似于C#中的swtich语句

·<Condition>：根据特定的条件应用动画

·<Parallel>：以并行方式运行一组动画

·<Sequence>：以顺序方式运行一组动画

在使用Sequence和Parallel选项时，一定要理解这些方法如何处理动画。Sequence是顺序执行的，即第二个动画必须在前一个动画结束后启动。而使用Parallel元素，所有的动画同时运行（并行）。

附实例一段：<%@ Page Language="C#" AutoEventWireup="true" CodeFile="changeSize.aspx.cs" Inherits="UseAnimation_changeSize" %> <%@ Register Assembly="AjaxControlToolKit" Namespace="AjaxControlToolkit" TagPrefix="ccl" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <script runat="server"> protected void Button1_Click(object sender, EventArgs e) { lblName.Text = "亲，包邮哦！！！" + txt1.Text; } </script> <title>字体渐变</title> </head> <body> <form id="form1" runat="server"> <ccl:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server" EnableScriptGlobalization="True"> </ccl:ToolkitScriptManager> <div> <asp:TextBox ID="txt1" runat="server"></asp:TextBox> <asp:Button ID="Button1" runat="server" Text="提交" OnClick="Button1_Click" /> <asp:Label ID="lblName" runat="server" /> <br /> <br /> <ccl:AnimationExtender ID="lblName_AnimationExtender" Enabled="true" TargetControlID="lblName" runat="server"> <Animations> <OnLoad> <Sequence> <Scale ScaleFactor="4" Unit="px" ScaleFont="true" FontUnit="pt" Duration="2.5" Fps="50"></Scale> </Sequence> </OnLoad> </Animations> </ccl:AnimationExtender> </div> </form> </body> </html>