【Axure9案例教程】固定顶部导航栏效果，动态面板固定顶部、选项组、交互动作（原型下载）

　　固定顶部导航栏 导航栏会一直固定在最顶部，当页面内容向下滚动时，导航栏仍然在顶部

　　 效果说明 顶部导航栏内容区域宽度为1200px 导航栏宽度全屏显示，根据浏览器的宽度自适应宽度 当浏览器宽度变化时，顶部导航栏的宽度跟随变化，一直适配浏览器的宽度 顶部导航栏底部有阴影效果，可以有效的分隔导航栏与内容区域 涉及知识点 动态面板固定到浏览器，固定在最顶部 选项组的运用，菜单切换效果 元件的交互样式，鼠标悬停时和选中时样式 自适应填充屏幕宽度效果 设置元件尺寸动作 移动元件位置动作 元件阴影分隔 操作要点 1、动态面板固定到浏览器

　　 2、阴影分隔 为背景框添加阴影，可以有效的将顶部导航栏与内容区域分隔开来 3、自适应效果 因为添加了动态面板固定到浏览器的操作，所以需要其他的交互动作来做自适应效果 需要在页面交互动作中添加“页面载入时”和“窗口尺寸改变时”交互动作，两处交互效果相同 移动背景框 X轴：[[-(Window.width-1200)/2]]，Y轴：[[LVAR1.y]]，LVAR1变量值来源自目标元件（也就是背景框） 设置背景框尺寸 宽度：[[Window.width]]，高度：72 4、选项组设置 选中需要组成选项组的元件，取一个组名称，就可以将这些元件组合起来了，注意不要和其他选项组名称重复 注意 复制时，需要复制页面交互效果，不然会失去宽度的自适应效果 背景框为顶部导航栏的矩形框命名，交互动作需要用到这个矩形框 原型下载立即下载

　　访问密码：8397