Axure Tutorial: Make Fixed Top Bar with Dynamic Panel

Introduction

The fixed top navigation bar is a frequently used control. This control is shown when the screen scrolls over a certain distance. It is very helpful when the navigation bar needs to be visible.

Widgets Setup

1. Make the basic structure of the website: including the top nav bar (non fixed), banner and content area.

 

2. Make the top nav bar (fixed): Make it into a dynamic panel and pin it at the top of the window.

 

Interactions Setup

 

When the window scrolls beyond the bottom of the banner, the top navigation bar (fixed) is shown; Otherwise it is hidden.

In this way, all the settings are completed. If you have any questions and suggestions, please leave a message.

If you like the article, please share it with others with page link, thanks for your supporting! ❤

Note: Click here to download the completed RP file for this tutorial (RP 10 or up).


Well Joe @AxureBoutique, a technology writer and teacher, focuses on Axure prototype design and product design.


Leave a comment

Please note, comments must be approved before they are published

This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.


This section doesn’t currently include any content. Add content to this section using the sidebar.