Данная статья будет посвящена добавлению комментариев во Flash ролик. При наведении мышью на картинку, через пару секунд появиться подсказка, которая будет следовать за мышью. Через данный урок ты так же узнаешь, как добавлять фото в ролик, как преобразовывать фото в movie clip и многое другое.
Наведите курсор на миниатюру фотографии!
Шаг 1
Во-первых, скачать миниатюру фотографий, которые мы будем использовать для этого урока.
Шаг 2
Создайте новый документ Flash. Нажмите Ctrl + J клавишу на клавиатуре (Свойства документа) и установите ширину вашего документа 450 пикселей и высотой 500 пикселей. Выберите затухающий цвет фона. Установите скорость проигрывания ролика 26.
Шаг 3
Выберите File > Import > Import to Library. В файле окно проводника, которое появится, найди 6 мини-картинок которые ты скачал(а) у меня, выдели все используя зажатую клавишу Shift. Затем нажми кнопку Открыть. Если сейчас открыть флэш библиотеку (Ctrl + L ), вы увидите шесть миниатюр автомобилей.
Шаг 4
Используя Selection Tool (V) перетащите миниатюры рисунков с флэш библиотеки, на рабочее поле и разместите их на позиции, как это показано на рисунке ниже!
Шаг 5
Выберите Selection Tool (V) и выделите первую миниатюру с автомобилем. После этого, нажмите клавишу F8 (Преобразовать в символ), чтобы превратить его в символ Movie Clip.
Выберите Selection Tool (V) и выделите первую миниатюру с автомобилем. После этого, нажмите клавишу F8 (Преобразовать в символ), чтобы превратить его в символ Movie Clip.
Шаг 6
Пока вновь созданный клип остается выделенным произведем некоторые действия. Внизу, на вкладке свойств объекта, есть поле для ввода имени для Movie Clip. Назовем его thumb1.
Пока вновь созданный клип остается выделенным произведем некоторые действия. Внизу, на вкладке свойств объекта, есть поле для ввода имени для Movie Clip. Назовем его thumb1.
Шаг 7
Теперь повторим вышеописанные действия для всех миниатюр называя их thumb2, thumb3 и т.д
Теперь повторим вышеописанные действия для всех миниатюр называя их thumb2, thumb3 и т.д
Шаг 8
Создайте новый слой, который будет выше слоя Layer1 и назовите его Tooltip (что переводиться как «подсказка»).
Создайте новый слой, который будет выше слоя Layer1 и назовите его Tooltip (что переводиться как «подсказка»).
Шаг 9
Выберите слой Tooltip и создайте нашу будущую подсказку.
Выберите слой Tooltip и создайте нашу будущую подсказку.
Шаг 10
Выберите Текст Tool (A) и перейдите к свойства панели (Ctrl + F3) которая находиться под рабочим полем программы.. Внесите изменения как показано на рисунке:
Выберите Текст Tool (A) и перейдите к свойства панели (Ctrl + F3) которая находиться под рабочим полем программы.. Внесите изменения как показано на рисунке:
Затем размести текстовое поле так, как показано ниже.
Шаг 11
Сделайте так, как показано на рисунке. Отцентруйте текстовое поле, нажав на соответствующую иконку (на рисунке иконка уже нажата).
Сделайте так, как показано на рисунке. Отцентруйте текстовое поле, нажав на соответствующую иконку (на рисунке иконка уже нажата).
Шаг 12
Дайте название вашему динамическому текстовому полю, так как на рисунке.
Дайте название вашему динамическому текстовому полю, так как на рисунке.
Шаг 13
Выделите все подсказки и нажми на клавишу F8 (Преобразовать в символ), чтобы превратить его в символ Movie Clip.
Выделите все подсказки и нажми на клавишу F8 (Преобразовать в символ), чтобы превратить его в символ Movie Clip.
Шаг 14
Затем назови получившиеся клипы так, как показано на рисунке.
Затем назови получившиеся клипы так, как показано на рисунке.
Шаг 15
Создайте новый слой выше слоя подсказки и назовите его Action (с англ. «Действие»).
Шаг 16
Выберите первый кадр Action и перейдите к панели AS (F9). Затем введите этот код в панель действий:
Выберите первый кадр Action и перейдите к панели AS (F9). Затем введите этот код в панель действий:
tooltip._visible = false;
var tipInt;
thumb1.onRollOver = function() {
tipInt = setInterval(showTip,100,"Audi R8");
}
thumb1.onRollOut = function() {
hideTip();
}
thumb2.onRollOver = function() {
tipInt = setInterval(showTip,100,"Bentley");
}
thumb2.onRollOut = function() {
hideTip();
}
thumb3.onRollOver = function() {
tipInt = setInterval(showTip,100,"BMW");
}
thumb3.onRollOut = function() {
hideTip();
}
thumb4.onRollOver = function() {
tipInt = setInterval(showTip,100,"Lamborghini");
}
thumb4.onRollOut = function() {
hideTip();
}
thumb5.onRollOver = function() {
tipInt = setInterval(showTip,100,"Mercedes");
}
thumb5.onRollOut = function() {
hideTip();
}
thumb6.onRollOver = function() {
tipInt = setInterval(showTip,100,"VW Touareg");
}
thumb6.onRollOut = function() {
hideTip();
}
var count = 0;
function showTip(tiptext) {
if(count == 5) {
clearInterval(tipInt);
count = 0;
tooltip.tiptext.text = tiptext;
tooltip._x = _root._xmouse;
tooltip._y = _root._ymouse;
tooltip._visible = true;
_root.onMouseMove = function() {
tooltip._x = _root._xmouse;
tooltip._y = _root._ymouse;
updateAfterEvent();
}
}
else {
count++;
}
}
function hideTip() {
clearInterval(tipInt);
tooltip._visible = false;
delete _root.onMouseMove;
}
Скачать исходник
Вот и всё, можно наслаждаться эффектом. В дальнейшем ты запомнишь это и будешь без проблем создавать различные эффекты.
