Start the Flash program. Click "Flash File(ActionScript 3.0)" from the splash window to create a new file for your AS3 rollover navbar.
Select "Actions" from the "Window" menu on the main Flash menu bar to open the ActionScript 3 editor. Position your mouse cursor on the first line of the ActionScript 3 editor. Click your mouse button, and type in the code below to stop the Flash movie from playing at the first frame of the Flash movie.
stop();
Type the code starting at the next line of the ActionScript 3 editor to create and place a red rectangular graphic on the stage that is positioned at Flash stage coordinates (50,50), has a width of 50 pixels, a height of 20 pixels and is drawn with a black line with a width of 4 pixels.
var myButton:MovieClip = new MovieClip();
myButton.graphics.lineStyle(4);
myButton.graphics.beginFill(0xFF0000);
myButton.graphics.drawRect(50, 50, 50, 20);
myButton.graphics.endFill();
addChild(myButton);
Type the code starting at the next line of the ActionScript 3 editor to add a mouse click event listener to the red button that will instruct Flash to go to "frame 2" of the movie when the red button is clicked.
myButton.addEventListener(MouseEvent.CLICK, frame2_fn);
function frame2_fn(event: MouseEvent): void
{
gotoAndStop(2);
};
Type the code starting at the next line of the ActionScript 3 editor to add a mouse rollover event listener to the red button that will instruct Flash to execute the instructions within the "roll_over_fn" function when the mouse cursor is moved over the red button.
myButton.addEventListener(MouseEvent.ROLL_OVER, roll_over_fn);
Type the code starting at the next line of the ActionScript 3 editor to create the roll_over_fn function and add the instructions that will add a small yellow rectangle (myButtonRoll) inside the red button when the mouse cursor is moved over the red button.
function roll_over_fn(event: MouseEvent): void
{
var myButtonRoll:MovieClip = new MovieClip();
myButtonRoll.graphics.lineStyle(4);
myButtonRoll.graphics.beginFill(0xFFFF00);
myButtonRoll.graphics.drawRect(72, 55, 10, 10);
myButtonRoll.graphics.endFill();
myButton,addChild(myButtonRoll);
};
Click "Timeline" in the "Window" menu on the main Flash menu bar. Position your mouse over "Frame 2" on the timeline. Click your mouse to select frame 2. Right click your mouse and select "Insert Blank Keyframe" from the context menu.
Press and release the "r" key on your keyboard to enable the rectangle drawing tool. Position your mouse cursor over the Flash stage and drag your mouse to draw a rectangle on the stage. Release the mouse button when the rectangle has a width of about 2 inches.
Click "Test Movie" from the "Control" menu to test your Flash website navigation program. Observe that the red button is displayed on the Flash stage. Position your mouse over the red button and observe that a yellow rectangular image appears within the red button. Click the red button and observe that the rectangle you created on frame 2 is now on the Flash stage and the red navigation button is still on the stage.
Continue adding more navbar buttons with AS3 code. Use button code similar to that already used but use different names for the rectangular buttons. Add one navbar button for each page
(frame) you add to your Flash website or presentation.