Axure Tutorial: Make Fixed Top Bar with Dynamic Panel

Well Joe
2 min readMay 23, 2022

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.

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.

#axure widgets #ux design #Axure templates #Axure tutorial #Axure #Product Design & Product Manager #UI / UX / Interaction Design

--

--