Macromedia Flash - Tạo hiệu ứng menu

Hoàn tất ta sẽ có hình như sau Bước 8 Lấy công cụ Text Tool A và vào phần Properties Panel Ctrl + F3 ở phía dưới.. Chọn các tùy chọn tương ứng như sau Sau đó tạo một loạt chữ có nội d

Tạo một

380 px v

là 24 fps

Bước 2

Chọn cô

viền bằn

vuông tr

thước kh

Bước 3

Trong kh

giữ phím

Bước 4

Vẫn chọ

thành m

t file flash

và chiều ca

s Hoàn tất

ông cụ Rec

ng cách kíc

rắng có đườ

hoảng 70 x

hi hình chữ

m Shift đồng

ọn công cụ

màu #FF540

Macrom

B k A

B mới Vào M

ao là 100 px toàn bộ kíc

tangle Too

h vào Stro

ờng chéo đ

x 70px và đặ

ữ nhật vẫn đ

g thời kéo v

Selection T

00

media Flas

Bài này sẽ hư khi di chuyể Action Scrip

Bước Modify > D

x Chọn mà

ch OK

ol (R) Tron

ke color (c

đỏ Màu nền

ặt nó vào v

đang được

và nhả chuộ

Tool (V), c

sh - Tạo h

ướng dẫn bạ

n chuột vào

pt Ngoài ra,

Document

àu nền là #

ng phần Col

có biểu tượ

n đặt là #39

vị trí như hìn

chọn, lấy c

ột để nhân

họn ô vuôn

hiệu ứng m

ạn cách tạo m Để tạo bài việc thiết kế

(Ctrl + J)

#f8f8f2 và t

lors của pa

ng bút chì n

93939 và vẽ

nh dưới

công cụ Sel

hình vuông

ng thứ hai v

menu

một menu fla này, bạn sẽ p

ế menu lại rấ

Đặt chiều thiết lập tốc

anel công cụ nhỏ) sau đó

ẽ một hình

lection Too

g lên nhiều

và thay đổi

ash với hiệu phải sử dụng

ất đơn giản

rộng của f

c độ Frame

ụ, khóa mà

ó chọn hình vuông có k

ol (V), nhấn

hình

màu của nó

ứng

g mã

1

ile là

e rate

u

h ô kích

n và

ó

Bước 5

Chọn tiếp ô vuông thứ 3 và đặt màu nó là #19A3CB

Bước 6

Ô vuông thứ tư có màu #FFA800

Bước 7

Và ô vuông cuối cùng có màu #94CA1A Hoàn tất ta sẽ có hình như sau

Bước 8

Lấy công cụ Text Tool (A) và vào phần Properties Panel (Ctrl + F3) ở phía dưới Chọn

các tùy chọn tương ứng như sau

Sau đó tạo một loạt chữ có nội dung tương ứng với từng menu

Bước 9

Dùng công cụ Selection Tool (V) và chọn ô vuông đầu tiên cùng với text (trong ví dụ

này là “HOME PAGE”) Nhấn phím F8 (Convert to Symbol) để chuyển hình chữ nhật và

text sang dạng Movie Clip Symol

Bước 10

Vẫn chọn Movie Clip vừa tạo, vào phần Properties Panel (Ctrl + F3) phía bên dưới Ở

phía phần bên trái, bạn sẽ tìm thấy một trường nhập Instance name Đặt tên lại cho

movie là homepage_mc

Bước 11

Chọn công cụ Selection Tool (V) và kích đúp vào movie clip trên màn hình làm việc

Bước 12

Vẫn dùng công cụ Selection Tool (V), chỉ chọn text và nhấn Ctrl + X (Cut) Sau đó tạo một layer mới và đặt tên là text Chọn layer text và nhấn phím Ctrl + Shift + V (Paste in

place)

Bước 13

Trở lại layer 1, kích đúp vào nó bằng công cụ Selection Tool (V) và đổi tên nó thành

rectangle

Bước 14

Trong khi vẫn chọn layer rectangle, nhấn phím F8 lần nữa (Convert to Symbol) để

chuyển nó sang dạng Movie Clip Symbol

Bước 1

Kích vào

Bước 1

Vẫn chọ

kéo hình

Bước 1

Kích chu

timeline

Bước 1

Chọn lay

Symbol

5

o frame 15

6

ọn frame 15

h chữ nhật

7

uột phải vào

và chọn Cr

8

yer text và

của layer r

5, lấy công c xuống như

o bất kỳ vị t

reate Motio

nhấn F8 (C

rectangle và

cụ Free Tra

ư hình sau:

trí nào tron

on Tween

Convert to S

à nhấn F6

ansform T

g vùng màu

từ menu xu

Symbol) để

ool (Q), nh

u xám giữa uất hiện

chuyển tex

hấn và giữ p

a hai keyfra

xt sang dạn

phím Alt rồ

me trên

ng Movie C

i

lip

Bước 19

Kích vào frame 15 của layer text và nhấn F6

Bước 20

Sử dụng phím mũi tên hoặc chuột để kéo text xuống dưới một chút để vào trung tâm của hình chữ nhật như hình sau

Bước 21

Kích chuột phải vào bất kỳ vị trí nào trong vùng màu xám giữa hai keyframe và chọn

Create Motion Tween

Bước 22

Trở lại scene chính (Scene 1)

Bước 23

Tạo một layer mới và đặt tên là Invisible Button Sau đó tạo một nút vô hình lên phía trên hình chữ nhật và text từ menu xuất hiện

Bước 24

Dùng công cụ Selection Tool (V) kích một lần vào nút vô hình đã tạo để chọn nó, vào

phần Action Script panel (F9) Sau đó đưa đoạn code sau vào:

on (rollOver) {

_root.mouse_over_homepage_mc = true;

}

on (rollOut) {

_root.mouse_over_homepage_mc = fstartlse;

}

on (release) {

getURL("http://www.quantrimang.com/");

}

Bước 25

Tạo một layer mới phía trên layer invisible button và đặt tên là action script

Bước 26

Kích vào frame đầu tiên của layer action script, vào phần Action Script Panel và đưa vào đoạn mã sau:

_root.homepage_mc.onEnterFrame = function() {

if (mouse_over_homepage_mc) {

_root.homepage_mc.nextFrame();

} else {

_root.homepage_mc.prevFrame();

}

};

Vậy là chúng ta đã hoàn thiện một nút trong menu, công việc tiếp theo của các bạn là thực hiện tương tự như vậy trên các trang tiếp theo Chú ý trong đoạn mã Action Script

có một địa chỉ URL cần phải thay đổi tương ứng trên từng menu khác nhau