5.4　保持固定位置

案例描述

当内容高度大于浏览器的高度，拉动滚动条，当页面内容滚动时，导航栏始终保持固定在顶部位置，如图5-30所示。

思路分析

• ▷　想将某些内容不随页面滚动而改变位置，可以将这些内容添加到动态面板的状态中。
• ▷　设置固定到浏览器窗口，分别设置“水平固定”和“垂直固定”。

操作步骤

（1）选择“文件”|“新建”命令，新建一个Axure的文档。

（2）在“元件库”面板中，将“图片”元件拖入编辑区中，如图5-31所示。在工具栏中将x和y分别设置为0，“宽度”设置为1025，“高度”设置为57。

（3）在编辑区中选择“图片”元件，单击鼠标右键，在弹出的快捷菜单中选择“导入图片”命令，如图5-32所示。

（4）弹出“打开”对话框，选择相应的素材文件，如图5-33所示，单击“打开”按钮，导入编辑区中。

（5）用同样的方法导入内容图片，如图5-34所示。

（6）在编辑区中选择导入菜单的图片，单击鼠标右键，在弹出的快捷菜单中选择“转换为动态面板”命令，如图5-35所示，将图片转换为动态面板。

（7）在右侧“检视：动态面板”区域中，将动态面板名称设置为meu；在“属性”面板中，单击“固定到浏览器”超链接，如图5-36所示。

（8）弹出“固定到浏览器”对话框，选中“固定到浏览器窗口”复选框，并设置“水平固定”为“居中”，“垂直固定”为“上”，如图5-37所示，单击“确定”按钮导航栏已固定在浏览器顶部。

（9）按Ctrl+S快捷键，以“5.4”为名称保存该文件，然后按F5键预览效果，如图5-38所示。