Выбор одной анимации из списка (VB)

Кристиан Венц (Christian Wenz)

Загрузить PDF-файл

Элемент управления Анимация в наборе элементов управления ASP.NET AJAX — это не только элемент управления, но и целая платформа для добавления анимаций в элемент управления. Платформа также позволяет программисту выбрать одну анимацию из списка анимаций в зависимости от оценки кода JavaScript.

Общие сведения

Элемент управления Анимация в наборе элементов управления ASP.NET AJAX — это не только элемент управления, но и целая платформа для добавления анимаций в элемент управления. Платформа также позволяет программисту выбрать одну анимацию из списка анимаций в зависимости от оценки кода JavaScript.

Этапы

Во-первых, добавьте ScriptManager на страницу . Затем загружается библиотека ASP.NET AJAX, что позволяет использовать набор средств управления:

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

Анимация будет применена к панели текста, которая выглядит следующим образом:

<asp:Panel ID="panelShadow" runat="server" CssClass="panelClass">
 ASP.NET AJAX is a free framework for quickly creating a new generation of more 
 efficient, more interactive and highly-personalized Web experiences that work 
 across all the most popular browsers.<br />
 ASP.NET AJAX is a free framework for quickly creating a new generation of more 
 efficient, more interactive and highly-personalized Web experiences that work 
 across all the most popular browsers.<br />
 ASP.NET AJAX is a free framework for quickly creating a new generation of more 
 efficient, more interactive and highly-personalized Web experiences that work 
 across all the most popular browsers.<br />
</asp:Panel>

В связанном классе CSS для панели определите хороший цвет фона, а также установите фиксированную ширину для панели:

<style type="text/css">    
 .panelClass {background-color: lime; width: 300px;}
</style>

Затем добавьте на AnimationExtender страницу , указав IDатрибут , TargetControlID и обязательный runat="server":

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

<Animations> В узле используйте для <OnLoad> запуска анимации после полной загрузки страницы. Вместо одной из обычных анимаций в <Case> игру вступает элемент . Вычисляется значение его атрибута SelectScript; Возвращаемое значение должно быть числовым. В зависимости от этого числа выполняется одно из поданиманий в <case> . Например, если selectScript имеет значение 2, набор средств управления запускает третью анимацию в регистре <> (подсчет начинается с 0).

Следующая разметка определяет три поданимания: изменение ширины, изменение высоты и угасание. Затем код JavaScript (Math.floor(3 * Math.random())) выбирает число от 0 до 2, чтобы выполнить одну из трех анимаций:

<ajaxToolkit:AnimationExtender ID="ae" runat="server"
 TargetControlID="Panel1">
 <Animations>
 <OnLoad>
 <Case SelectScript="Math.floor(3 * Math.random())">
 <Resize Width="1000" Unit="px" />
 <Resize Height="150" Unit="px" />
 <FadeOut Duration="1.5" Fps="24" />
 </Case>
 </OnLoad>
 </Animations>
</ajaxToolkit:AnimationExtender>

Одна из трех возможных анимаций: панель становится шире (щелкните, чтобы просмотреть полноразмерное изображение)

НазадВперед