品牌型号：联想Yoga 14Sitl

系统：Windows 10 64位专业版

软件版本：Axure rp 9

固定导航栏是个常见的需求，尤其是在做网页原型的时候，我们通常希望导航栏在滚动页面时，能一直停在浏览器窗口的顶部位置。固定元素在长页面或者复杂布局里很重要，比如返回顶部按钮，能够提高操作效率。下面就为大家介绍Axure怎么固定导航栏，Axure固定到浏览器自定义位置的相关内容。

一、Axure怎么固定导航栏

虽然Axure没有直接的固定到浏览器功能，但可以通过动态面板来实现类似的效果。我们可以通过一个简单的网页案例来模拟这个效果，我们可以用下面的四个步骤来实现：

1、制作导航栏

我们通过矩形元件制作导航栏的底框，尺寸为1440*180像素。1440是大部分网站常用的宽度尺寸。再用文本标签元件打上文字【首页】、【商品】、【关于】、【我的】，模拟我们常见到的网页导航栏。

2、转换为动态面板

鼠标划选选中构成导航栏的所有元件（也可以使用快捷键Ctrl+A），点击鼠标右键找到【转换为动态面板】选项。转换成功后，导航栏上会多一层蓝色的标识，在左侧概要面板中可以看到导航栏被放入动态面板的状态1中。

3、固定到导航栏

选中动态面板后，点击鼠标右键，找到【固定到浏览器】选项。

在弹出的窗口中勾选【固定到浏览器窗口】，选择具体的固定位置。在这个案例中，我们选的是【居中】和【顶部】，这是常见的网页浏览器固定位置。选择完成后，点击确定按钮。

4、预览测试

因为我们只有一个导航栏，页面的内容是很“短”的，没有内容可以滚动，我们就不能测试出来固定浏览器到底有没有生效。为此，我们要在画布中多放一些东西用于滚动。例如，在y轴2448坐标位置放了一个矩形。一定要确保矩形放的位置超过浏览器一屏的高度。因为每个人的电脑和具体的浏览器不一样，所以浏览器一屏的高度不是一个统一的数值，如果你不知道具体的数值，你可以尽可能地把矩形往y值大的位置放。

点击预览后，在浏览器中，我们可以看到，我们需要不停滚动界面才能看到底部的矩形，但顶部的浏览器是一直都可见的，没有跟着滚动，说明导航栏固定到浏览器效果制作成功。

二、Axure固定到浏览器自定义位置

在许多网站中，返回顶部按钮是一个常见的功能，我们可以随时快速返回页面顶部。通过Axure，我们可以将这个按钮固定到浏览器的自定义位置，即使滚动页面，它都始终保持可见，提供更便捷的操作体验。我们通过以下三个步骤对固定到浏览器自定义位置这个效果进行模拟。

1、制作静态界面

我们用矩形、文本标签元件制作如图7所示的界面。顶部模拟的是导航栏，右侧放一个打上【回到顶部】的矩形，底部是一个用来让页面足够长，能够滚动起来的矩形。

2、固定【回到顶部】按钮

点击【回到顶部】按钮，右键选择【转换为动态面板】。变成蓝色样式后，说明转换成功。

再次点击鼠标右键，选择【固定到浏览器】。

在弹出的窗口中，我们勾选【固定到浏览器窗口】。我们常见的回到顶部按钮一般是在网页的右下方，因此我们水平方向选择【右侧】，边距填10。垂直方向选择【底部】，边距填20。

3、预览测试

点击预览后，在浏览器中，我们可以看到，当滚动界面的时候，回到顶部按钮一直在页面的右下方。说明案例制作完成。

以上就是Axure怎么固定导航栏，Axure固定到浏览器自定义位置的相关内容。固定导航栏能避免在长页面中，我们需要一直滚回顶部找菜单。固定到自定义位置能让重要元素一直显示在屏幕上，我们操作起来会更顺手。