вход

Flash эффект “за курсором мыши”

В этом flash уроке посмотрим, как очень просто заставить мувик (Movie Clip) двигаться за курсором мыши. Flash эффект движения за курсором мыши очень просто изменить и придать любой вид двигающемуся за курсором объекту Movie Clip. Примечание: Для этого урока понадобиться библиотека TweenMax.

Как это выглядит

[SWF]http://mainview.ru/wp-content/uploads/flash/Flash-movie-clip-follower.swf,600,400[/SWF]

Создание документа

1. Создаём новый Flash ActionScript 3 документ. 2. Установим размеры документа 400х300 пикселей и темп 30 fps.

Создание фона.

3. Выбираем инструмент rectangle и создаём прямоугольник размером 400×300 пикселей без обводки. Выровним его по центру сцены по горизонтали и по вертикали. 4. Добавим радиальную заливку нашему прямоугольнику (цвет слева: #00CCFF, цвет справа: #000000)

Новый слой для клипа под курсором

5. Создаём новый слой и назовём его “follower”.

Создание клипа

6. В созданном слое “follower” рисуем белый круг без обводки. Размер круга 25×25 пикселей. Конвертируем созданный круг в movie clip со следующими настройками: 7. Созданному клипу назначим имя “follower”.

Создание скрипта ActionScript 3

8. После того как мы всё подготовили в сцене, нам осталось только добавить скрипт, который заставит двигаться мувик за курсором мыши. Создадим новый слой и назовём его “actions” и в нём добавим скрипт:
//Импортируем библиотеку TweenMax
import com.greensock.*;

//Будем следить за движениями мыши
stage.addEventListener(MouseEvent.MOUSE_MOVE, mouseMoves);

//Эта функция вызывается когда мышь начинает двигаться
function mouseMoves(e:Event):void {

	//Перемещаем клип в координаты мыши
	TweenMax.to(follower, 0.5 ,{x :mouseX, y: mouseY});
}
Здесь мы просто слушаем движения мыши, и когда она начинает двигаться, мы двигаем мувик в координаты текущего положения мыши. Мы используем библиотеку TweenMax, чтобы сделать движения более плавными и красивыми. Чтобы добавить некоторую размытость, будем использовать следующий код:.
// Вызываем функцию присвоения различных свойств мувику
up();

//Эта функция добавляет размытость и изменяет масштаб
function up():void {

	//Tween размытия
	TweenMax.to(follower, 0.5, {blurFilter:{blurX:15, blurY:15}});

	//Tween масштабирования и вызов функции down() после завершения
	TweenMax.to(follower, 0.5, {scaleX: 1.5, scaleY:1.5, onComplete: down});
}

//Эта функция удаляет размытость и масштабирование
function down():void {

	//Tween размытия
	TweenMax.to(follower, 0.5, {blurFilter:{blurX:10, blurY:10}});

	//Tween масштабирования и вызов функции up() после завершения
	TweenMax.to(follower, 0.5, {scaleX: 0.5, scaleY:0.5, onComplete: up});

}
Как легко увидеть, вся анимация совершается функциями down() и up(). Мы просто используем последовательность этих функций. На этом наш flash эффект готов. Скачать исходник.

Нашли это полезным? Поделитесь с другими:
Не останавливайтесь, читайте дальше:
Оставить комментарий

Статья → Flash эффект “за курсором мыши”

Правила комментирования

  1. Кoммeнтapий всегда проходит премодерацию.
  2. В поле "URL блога" можно указывать только ссылку на главную страницу вашего блога. Ссылки на прочие веб-ресурсы (в том числе блоги/сплоги, созданные не для людей) будут удалены.
  3. Запрещается использовать в качестве имени комментатора слоганы/названия сайтов, рекламные фразы, ключевые и т.п. слова. В случае несоблюдения этого условия имя изменяется по усмотрению владельца блога. Просьба указывать нормальное имя или ник.
  4. Весьма вероятно, что короткий и неинформативный кoммeнтapий вида "Спасибо!", "Интересная статья", будет удален. Исключение составляют знакомые автору блога комментаторы.