WebDix
Это веб-диз, детка!Выпуск #7 | 26 августа 2006
Быстрый переход
WebDix › Выпуск #7 › Flash

Создание простейшего слайд-шоу

Автор: Nikitar
http://rusforumz.com

Сегодня мы займёмся созданием простейшего слайдшоу. Хотя в принципе не такое оно будет и простейшее. Я пользуюсь Macromedia Flash 8 (английский) чего и вам советую, однако для владельцев русскоязычной версии также буду что-то разъяснять. Это слайдшоу можно делать на всех версиях Flash, начиная с 5-й. Поехали.

1. Открываем Flash и создаём новый документ с параметрами, которые вы видите на скриншоте ниже. То есть размеры в ширину и высоту такие, какие у вас будут картинки для слайдшоу (картинки должны быть одного размера). У меня это аватары (из соседнего раздела) и размеры у них 128*128. Частота кадров 25 лучше сделать.




2. Вставляем картинки в библиотеку флэша. Для этого выберите File (Файл) - Import (Импорт) - Import to library (Импортировать в библиотеку)



3. Теперь вставьте одну картинку в первый кадр главной сцены. Просто перетащите её из библиотеки. Чтобы открыть библиотеку, выберите Window (Окно) - Library (Библиотека). Вставьте картинку так, чтобы она занимала всё свободное место.

4. Выделите картинку одним кликом на неё и нажмите F8. В появившемся окне выберите MovieClip (видеоклип) и нажмите OK.

5. Войдите в мувиклип двойным щелчком по нему. В нём 1 кадр, в котором находится ваша картинка. Создайте второй ключевой кадр (выделите кадр и нажмите F6) и вставьте туда вторую картинку и так со всеми картинками.




6.Вернитесь на главную сцену. Там тоже 1 слой, с 1 кадром. Создайте второй слой выше первого. Скопируйте мувиклип, который у вас на самом нижнем слое и вставьте в верхний слой так, чтобы он был точно поверх первого. Теперь в instance name (имя экземполяра), которое находится в Properties (Свойства) мувиклипа (для того, чтобы они появились выделите мувиклип) напишите g2 для самого нижнего мувиклипа и g1 для верхнего.




7. Создайте новый слой поверх остальных. Затем перетащите всё, что в первом кадре во второй, чтобы первый кадр стал пустым. Затем сделайте нижний ролик с прозрачностью 0 (выделите его мышкой, и выберите внизу в свойствах Color (Цвет)-alpha (Прозрачность), там передвиньте ползунок на 0). Верхний ролик оставьте без изменений.

8. Теперь выделите второй кадр на нижнем слое и внизу в свойствах поставьте Tween - Motion (Движение). Повторите тоже самое с верхнем слоём. Поставьте ключевой кадр в 20-й кадр на обоих слоях. Между вторым и 20-м кадром должна появиться фиолетовая область со стрелочкой на обоих слоях. Как на скриншоте.




9. Создайте слой поверх второго слоя. И в первый кадр добавьте следующий код:

i=1;
function f_play(){
play();
}

А во второй кадр (сначала сделайте его ключевым) такой код:

stop();
g1.gotoAndStop(i);
g2.gotoAndStop(i+1);
setInterval(f_play, 5000);

Вместо 5000 (пауза в милисекундах) поставьте своё значение.

Ну и в 20-й вот такой:

if(i==g1._totalframes){
i=1;
gotoAndPlay(2);
}
else{
i++;
gotoAndPlay(2);
}



10. И вот что мы получаем в итоге. Для этого нажмите Ctrl+Enter.



« Динамическая замена курсораСодержаниеНовости »
Выпуск подготовили: Exact, Nikitar, Psi, Alisha |  Copyright RusForumz.com 2006
Перепечатка материалов возможна только с письменного разрешения администрации
Журнал WebDix («Это веб-диз, детка!»), 2006-2008.
Сайт журнала: webdix.ru · форум: rusforumz.com
Об архиве
Рейтинг Old-Web