UpdatePanelAnimation控件用来装饰UpdatePanel更新的效果,提供对UpdatePanel更新时和更新后的特效,并允许用户定义这些特效。定义的语法与“Animation”控件类似。
属性:
TargetControlID:要应用特效的UpdatePanel的ID。
OnUpdating:更新时应用的特效。
OnUpdated:更新后应用的特效。
代码实例:
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>UpdatePanelAnimation</title>
</head>
<body>
<form id="form1" runat="server">
<ajaxToolkit:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server">
</ajaxToolkit:ToolkitScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
<ContentTemplate>
单击按钮后,会改变时间的背景颜色<br />
<asp:Label ID="Label1" runat="server" Text=''></asp:Label>
<br />
<asp:Button ID="Button1" runat="server" Text="Button" onclick="Button1_Click" />
</ContentTemplate>
</asp:UpdatePanel>
<ajaxToolkit:UpdatePanelAnimationExtender ID="UpdatePanelAnimationExtender1" runat="server"
TargetControlID="UpdatePanel1">
<Animations>
<OnUpdated>
<Sequence>
<Parallel duration="2" Fps="30">
<Color StartValue="#ff3f3f" EndValue="#ffffff" Property="style" PropertyKey="backgroundColor" />
</Parallel>
</Sequence>
</OnUpdated>
</Animations>
</ajaxToolkit:UpdatePanelAnimationExtender>
</form>
</body>
</html>
后台代码:<head runat="server">
<title>UpdatePanelAnimation</title>
</head>
<body>
<form id="form1" runat="server">
<ajaxToolkit:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server">
</ajaxToolkit:ToolkitScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
<ContentTemplate>
单击按钮后,会改变时间的背景颜色<br />
<asp:Label ID="Label1" runat="server" Text=''></asp:Label>
<br />
<asp:Button ID="Button1" runat="server" Text="Button" onclick="Button1_Click" />
</ContentTemplate>
</asp:UpdatePanel>
<ajaxToolkit:UpdatePanelAnimationExtender ID="UpdatePanelAnimationExtender1" runat="server"
TargetControlID="UpdatePanel1">
<Animations>
<OnUpdated>
<Sequence>
<Parallel duration="2" Fps="30">
<Color StartValue="#ff3f3f" EndValue="#ffffff" Property="style" PropertyKey="backgroundColor" />
</Parallel>
</Sequence>
</OnUpdated>
</Animations>
</ajaxToolkit:UpdatePanelAnimationExtender>
</form>
</body>
</html>
protected void Page_Load(object sender, EventArgs e)
{
this.Label1.Text = DateTime.Now.ToString();
}
protected void Button1_Click(object sender, EventArgs e)
{
System.Threading.Thread.Sleep(3000);
}
{
this.Label1.Text = DateTime.Now.ToString();
}
protected void Button1_Click(object sender, EventArgs e)
{
System.Threading.Thread.Sleep(3000);
}
运行结果:
单击提交按钮后