Axure make menu bar effect

How to use Axure Make the menu bar with the above effect ？ Go straight to step ：

1. newly build 1 Masters （ Menu bar template ） and 5 A page （ page 1—— page 5）, When you click the menu bar button , Corresponding pop-up page effect
   

2. 【 Master production 】 Make a menu box , Drag a rectangle and enter “ page 1”, Drag a small icon and rectangle to make a combination .
   

3. 【 Master production 】 Menu box attribute settings ： Rectangle and small icon set properties respectively , The attribute is white on black , Set white characters on a green background when the mouse hovers , When a component is selected, it has green characters on a black background .
   

4. 【 Master production 】 Menu box interactive settings 1： Rectangle setting interaction , If the current combination is selected == really , The rectangle is set to selected . Small icons do the same interaction design .

5. 【 Master production 】 Copy the menu box above 5 individual , And they were renamed ： page 1、 page 2、 page 3、 page 4、 page 5

6. 【 Master production 】 Menu box interactive settings 2：“ page 1” Combination setting interaction , Open link when clicked , Link as page 1, The effect is to click on the menu box “ page 1” It will jump to “ page 1” page . rest 4 Make the same settings for the menu boxes

7. 【 Master production 】 Add master to 5 Page

8. 【 Page interaction 】 Enter the page 1, Set up interaction ： When the page loads , Menu bar combination “ page 1” Set to selected . rest 4 Make the same settings for each page .
   

After completing the above settings , preview , You can see the interaction effect at the top ！