Статьи

Совет: вызовите jQuery внутри AS3 с помощью jotAQuery

Март 29, 2019

Связь между Flash и Javascript — это то, с чем должен быть знаком любой разработчик ActionScript; К счастью, есть классы, которые помогают нам в этом процессе. Прочитайте этот Быстрый совет, чтобы узнать, как это просто!

Шаг 1: Зачем мне нужен Javascript?

jQuery и as3 с помощью jotAQuery

Интерактивность.

От интеграции с браузером (кнопки «назад», «вперед») до полной манипуляции SWF (изменение реальных встроенных свойств фильма, параметров и т. Д.) Оба языка очень мощные и могут быть даже более, когда вы их комбинируете.

Необработанный Javascript можно вызывать с помощью класса External Interface, встроенного в ActionScript 3, но представьте себе мощь и простоту jQuery и его готовых методов и функций. Звучит отлично, посмотрим, как это делается.

Шаг 2: ActionScript + jQuery

jQuery и as3 с помощью jotAQuery

jotAQuery — это порт ActionScript для jQuery, который позволяет использовать код jQuery внутри класса ActionScript 3. Большинство методов jQuery доступны для использования, хотя некоторые не могут быть реализованы.

Чтобы заставить jotAQuery работать, вам понадобится скомпилированный Flash-ролик с использованием классов jotAQuery и HTML-файла, в который вы будете вставлять swf. Вам также нужно будет связать библиотеку jQuery с вашим HTML-файлом.

На следующих шагах мы собираемся создать простой пример, который исчезнет в SWF-фильме с использованием jQuery.

Шаг 3: Загрузите jotAQuery

jQuery и as3 с помощью jotAQuery

Перейдите на страницу кода jotAQuery google и загрузите исходные файлы. Вам нужно будет просмотреть исходный код, чтобы получить три необходимых файла, поскольку они не отмечены в разделе загрузок.

Шаг 4: ActionScript

Подготовьте новый класс ActionScript и напишите следующий код: 

 пакет 
 {
	 импорт flash.display.Sprite;
	 импорт com.singuerinc.as3.external. *;
	
	 Публичный финальный класс Main расширяет Sprite
	 {
		 публичная финальная функция Main ()
		 {
			 / * Пример вызова * /
			
			 / * $ ('# flashContent'). slideUp (300);  * /
			
			 / * Вы также можете загрузить код, используя этот синтаксис * /
			
			 jQuery.execute
			 (
				 <JQuery> <! [CDATA [
  					 $ ('# flashContent'). css ({opacity: 0});
					 $ ('# flashContent'). animate ({opacity: 1}, 2000);		
				 ]]> </ JQuery>
			 );
		 }
	 }
 }

Свяжите этот файл как класс документа в вашем FLA и перейдите к части HTML.

Шаг 5: HTML

Вы можете использовать HTML-файл по умолчанию, экспортируемый Flash (отметьте поле HTML в меню « Опубликовать» ), просто укажите ссылку на исходный файл jQuery:

01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
19
!DOCTYPE html PUBLIC «-//W3C//DTD XHTML 1.0 Strict//EN» «http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd»>
<html xmlns=»http://www.w3.org/1999/xhtml» lang=»en» xml:lang=»en»>
    <head>
        <title>jotAQuery</title>
        <meta http-equiv=»Content-Type» content=»text/html; charset=utf-8″ />
        <style type=»text/css» media=»screen»>
        html, body { width:100%;
        body { margin:0;
        #flashContent { width:600px;
        </style>
 
        <!— Add jQuery Script—>
        <script type=»text/javascript» src=»http://code.jquery.com/jquery-1.4.1.min.js»></script>
     
    </head>
    <body>
        <div id=»flashContent»>
 
…html continues here

Откройте этот файл и посмотрите эффект вживую!

Вывод

Откройте для себя силу jQuery и попробуйте разные примеры взаимодействия. Надеюсь, вам понравился этот Quick Tip, спасибо за чтение!

33
Share: