Create navigation buttons

This is the effect of a navigation button, as follows: [upload = swf] viewfile. asp? ID = 96042 [/upload]
[Flash = 750,100]/bbs/attachments/oldupload/upload/200421911115769545.swf[/flash]
I have seen a similar full-code implementation in the past, and the code is very complicated. The following tutorial does not show the full-code implementation effect. With MC and button components, laruence can directly download the source file, at a glance, the code will understand that if you are a beginner or not very familiar with the scripting language, don't worry. This tutorial is intended for beginners, as long as you follow what I said step by step, package you succeeded. If not, you beat me!
Not to mention nonsense. Let's start:

Step 1: make various related components:
1. Use the rectangle tool, text tool, and line tool to create the background color, text, and delimiter of the navigation bar. The effect is shown in figure (1;


2 .) create a button component for a rectangle, copy 7 (8 in total) and place them on the top of each text, and adjust the transparency to 0, as shown in figure (2 );


3 .) create a rectangle MC with the same size as the button (which occupies four words), as shown in figure (3) to enter the MC editing status, turn it into a shape gradient that is scaled down along the X direction, as shown in figure (4;





4.) adjust the positional relationship between layers. See my source file for specific parameters (which will be provided at the end );


Step 2: Add a script language to achieve the final animation effect:
Add the code on the "homepage" button (as shown in figure (5 )):


On (rolover) {// code executed when the mouse slides over the button; _ root. xx = 90.0; // assign a value to the xx variable in the home scene; _ root. mc. _ xscale = 80; // because the home page button is relatively small, MC is reduced in the X direction. Other buttons are: _ root. mc. _ xscale = 100; _ root. mc. gotoAndStop (2); // stop the MC at 2nd frames; // coloring _ root. mc. c = new Color (_ root. mc) // create a color regulator for the mc object; _ root. mc. c. setRGB (random (0 xFFFFFF); // adjust the color of mc and then select a color;
}
On (rolout) {// code executed when the mouse slides out of the button; // _ root. xx =-62.0; // This code can be added or not added. You can try it. _ root. mc. gotoAndPlay (2); // mc starts playing and disappears only to mc ;}


Add the code on mc (as shown in figure (6 )):


OnClipEvent (enterFrame) {dx1 = _ root. xx-this. _ x; // assign the distance between the current mc location and the target location to the variable dx1; dx2 = dx1/2; // dx2 is the elasticity coefficient; the closer the mc is to the target location, the slower the speed; this. _ x + = dx2; // auto-increment coordinate value to move mc until it reaches the target position ;}


Note:1. The code on each button is the same and the only difference is that _ root is the most important. the value assigned by the variable xx is different. Take the last button "information service" as an example. The X coordinate of the button itself is 588, and the MC width is about 60, in this case, _ root should be given to the button. xx: The value of this variable is 588 + 30 + 10 = 628. 30 represents half of the MC width, and 10 represents the distance from the text to the left delimiter; and so on ......
2. The main idea is to move the mouse over the button and change the value of _ root. xx to stimulate the MC position change;
Step 3: attach the usage of the main functions (sorted from the AS dictionary ):
MyColor. setRGB (color_value) parameter: myColor: an existing Color object. (In this example, it is _ root. mc. c) Color_value: hexadecimal color value, indicating the color value to be set. Return: no description: Use the setRGB method of the Color object to set the specified Color for the myColor object. The parameter (color_value) is usually set to a hexadecimal color value (for example, 0xFF0000 ).