通过

在动画演示过程中禁止操作

Christian Wenz

本文档是 Visual C# 教程（转至 Visual Basic 教程）

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" />

注意，这里使用的是 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" />

但在本案例中，启用按钮是无用的，因为在动画结束时按钮会淡出，不再显示出来了。

一开始运行动画就禁用按钮

 

 

下一篇教程