Axure8.0: Label navigation bar

Label navigation bar is a common product dynamic effect. How to make it with Axure8? This article shows this. Let's have a look.

Shared this time case yes Axure 8.0 Fabricated Label navigation bar

 Axure8.0: Label navigation bar

Preview and download address: https://40074m.axshare.com

1、 Prototyping

1) Make a LOGO and navigation menu with two rectangles, as shown in the figure:

 Axure8.0: Label navigation bar

2) Make two menus with two rectangles, as shown in the figure:

 Axure8.0: Label navigation bar

3) Use repeater to make menu, as shown in the figure:

 Axure8.0: Label navigation bar Click the repeater to enter, and make a menu on the left with a rectangle, as shown in the figure:

 Axure8.0: Label navigation bar

4) Use a rectangle to make the front page label, as shown in the figure:

 Axure8.0: Label navigation bar

5) Create a label menu with the repeater, as shown in the figure:

 Axure8.0: Label navigation bar

Click the repeater to enter, make the left menu and close button, as shown in the figure:

 Axure8.0: Label navigation bar

6) Make a dynamic panel to switch pages, as shown:

 Axure8.0: Label navigation bar

7) Make a frame, and select the frame target as the home page.

 Axure8.0: Label navigation bar

2、 Interactive settings

1) Set the event "when each item is loaded" for the menu repeater, as shown in the figure:

 Axure8.0: Label navigation bar

Click the repeater to enter, and set the events of "mouse click", "select" and "deselect" in the data menu.

 Axure8.0: Label navigation bar

2) Click the "Home Page" tab to set the "When the mouse clicks" event.

 Axure8.0: Label navigation bar

3) Set the "When each item is loaded" event for the tag repeater.

 Axure8.0: Label navigation bar

Click the repeater to enter, and set the "mouse click" and "select" events for the "menu label".

 Axure8.0: Label navigation bar

Set the event of "mouse click" for the close button.

 Axure8.0: Label navigation bar

 

Operation article of last year and today

  1. 2023:   Baidu judged it as a low-quality website! How to rectify? (0)
  2. 2023:   In the first week of September, the top list of "Bili Bili Fei Gua" data station B UP was released! (0)
  3. 2023:   Advertisements soared by 5 million, and station B set a new benchmark in the second half of the year (0)
  4. 2023:   How does Huawei mobile phone import the curriculum added in the memo into the calendar? (0)
  5. 2023:   How to use Win11 computer notes to quickly set course reminders? (0)

This article was contributed by Xianxianlu, which does not represent the position of Love Operation. If it is reproduced, please indicate the source: https://www.iyunying.org/pm/axure/291350.html

fabulous (0)
 Head portrait of Cixianlu Fibrillar dew Contributors
Previous September 6, 2022
Next September 6, 2022

Recommended information

Post reply

Sign in Can't comment until
Share this page
Back to top