Macrom
media Flas - Tạo h ứng m
sh hiệu menu
Bài
B này sẽ hư ướng dẫn bạ cách tạo m menu fla với hiệu ứng
ạn một ash
khi
k di chuyển chuột vào. Để tạo bài này, bạn sẽ p sử dụng mã
. phải g
Action Scrip Ngoài ra, việc thiết kế menu lại rấ đơn giản.
A pt. ế ất
Bước
B 1
Tạo một file flash mới. Vào M
t Document (Ctrl + J). Đặt chiều rộng của file là
Modify > D
380 px v chiều ca là 100 px Chọn mà nền là #
và ao x. àu #f8f8f2 và tthiết lập tốc độ Frame rate
c e
là 24 fps Hoàn tất toàn bộ kíc OK.
s. ch
Bước 2
Chọn cô cụ Rectangle Too (R). Tron phần Col
ông ol ng lors của pa
anel công cụ khóa màu
ụ,
viền bằn cách kích vào Stroke color (c biểu tượng bút chì n
ng có nhỏ) sau đó chọn hình ô
ó h
vuông tr
rắng có đườ chéo đ Màu nền đặt là #39
ờng đỏ. n 93939 và vẽ một hình vuông có k
ẽ kích
thước kh
hoảng 70 x 70px và đặ nó vào v trí như hìn dưới.
ặt vị nh
Bước 3
Trong kh hình chữ nhật vẫn đ
hi ữ đang được chọn, lấy c
công cụ Sel
lection Too (V), nhấn và
ol n
giữ phím Shift đồng thời kéo v nhả chuộ để nhân hình vuông lên nhiều hình.
m g và ột g
Bước 4
Vẫn chọ công cụ Selection T
ọn Tool (V), chọn ô vuôn thứ hai v thay đổi màu của nó
ng và ó
thành m #FF540
màu 00
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 15
Kích vào frame 15 của layer r
o rectangle và nhấn F6
à
Bước 16
Vẫn chọ frame 15 lấy công c Free Tra
ọn 5, cụ ansform Tool (Q), nh và giữ p
hấn phím Alt rồi
kéo hình chữ nhật xuống như hình sau:
h ư
Bước 17
Kích chu phải vào bất kỳ vị t nào trong vùng màu xám giữa hai keyframe trên
uột o trí u a
timeline và chọn Cr
reate Motio Tween từ menu xu hiện.
on uất
Bước 18
Chọn lay text và nhấn F8 (C
yer Convert to S
Symbol) để chuyển tex sang dạn Movie Clip
xt ng
Symbol.
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.
Copyright by webtailieu.net