How to Create an Advanced Flash Website
Advanced flash websites incorporate various features, such as flash effects, manipulation of objects and elements on stage via ActionScript and a loading flash animation that shows the progress of a loading website.
As a rule of thumb, functionality takes precedence over aesthetics. In addition, these features should enhance the website rather than distract the visitor. The addition of these features does not make practical sense if they cause unnecessarily long loading times. Flash features should be used sparingly on any website for the above reason.
Other People Are Reading
Instructions
-
Preloading
-
1
Create a new layer on the timeline and name it "Preloader."
-
2
Click on frame 2 of the "Preloader" layer and type the text "loading" while formatting the text as desired.
-
-
3
Convert the text to a movie clip by pressing F8 and naming it "Loader".
-
4
Double click the "Loader" movie clip and type a second text field on the right with the text "99%" as follows:
Loading 99%
-
5
Go back to the root mainline and click on the "Loader" movie clip.
-
6
Press F9 and type the code below:
onClipEvent (load) {
total = _root.getBytesTotal();
}
onClipEvent (enterFrame){
loaded = _root.getBytesLoaded();
current = int(loaded/total*100);
p = ""+current+ "%";
if (loaded == total) {
_root.gotoAndStop(2);
} -
7
Create a new layer "Actions."
-
8
Click on frame 1 and press F8. Type the code below:
Stop();
Animated Interactivity
-
9
Create a new "Buttons" layer on the timeline.
-
10
Drag a button graphic from the library and place it on the main stage.
-
11
Press F8 to convert the graphic to a movie clip. Name it "ButtonMC."
-
12
Press F8 again and convert it to another clip called "AboutMC."
-
13
Give the "about_mc" an instance name; place "about_mc" under the "Properties" tab.
-
14
Double click the "AboutMC" and add 2 extra layers on its timeline, "Effect" and "Text."
-
15
Double click the "AboutMC" and press F8 again to convert to a button symbol.
-
16
Double-click the "AboutMC" button symbol and set the appropriate "Up" "Over" "Down" and "Hit" states. Use any design or image from the library to define how the button displays when the mouse is placed over the button and vice versa.
-
17
Add the code below for each button by pressing F9 on frame 1 of the "Actions" layer:
About_mc.onRelease = function()[
getURL ("http://www.aboutus.com", "_blank")
Customize each link to reference the right page when clicked.
-
18
Add the page contents and graphics by dragging them onto the main stage for each button instance.
-
19
Press Ctrl + Enter to test.
-
1
Tips & Warnings
If you are having problems designing the preloader, try downloading some free preloaders online that you can customize.
References
Resources
- Photo Credit movie reel image by Maria Bell from Fotolia.com
