Axure10 案例：制作固定在顶部的导航

最新推荐文章于 2024-09-03 08:59:57 发布
最新推荐文章于 2024-09-03 08:59:57 发布
阅读量1.5k 收藏 11
点赞数 5
分类专栏： Axure 10 基础和原型设计教程 文章标签： axure ux 产品运营 Powered by 金山文档
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/a186442733/article/details/129218966
版权
本教程介绍了如何使用Axure10制作页面滚动时固定在顶部的导航。通过设置元件和交互，实现当滚动到特定位置时，导航栏在页面顶部始终保持可见，提供无缝用户体验。
摘要由CSDN通过智能技术生成

介绍

页面滚动时，我们在网站上可以经常看到固定在顶部的导航，它保证了用户在任何时候都可以利用顶部导航。

本教程的方案采用了最简洁快速的方式，与现有的实现方法不同。它解决了页面向下滚动时，页面中间的导航的固定效果问题。（适用于web或app端）

要实现的功能

1.当页面滚动到蓝色内容下方时，将显示固定的顶部导航。

2.当页面滚动到蓝色内容上方时，将隐藏固定的顶部导航

最低0.47元/天 解锁文章
Axure RP从入门到精通（五十一） 案例 - 左侧菜单栏导航
人不风流枉少年
08-10 2385
1 更改页面尺寸，将Auto改为Web，页面布局改为左侧对齐。 页面尺寸和页面布局都会对元件的位置有影响。 拖一个动态面板作为左侧菜单导航栏的整体容器，设置x:0, y:50（这里留出50是给顶部导航使用的）w: 210，双击动态面板进入State1设置填充颜色R: 48 G: 66 B: 86，动态面板只有一个状态State1。 页面载入时设置尺寸，设置高度为：[[Window.height - 50]]，至此左边导航栏的容器算是完成。 双击导航栏容器进入State，拖拽一个矩形作为一级
【Axure】如何让导航栏固定到浏览器底部或顶部？（已解决，图文教你）
【敦厚的曹操】的专栏
03-26 9361
一、把导航图片，点右键，转换为动态面板。 二、右键转换后的“动态面板”，按下图打对勾。 三、在固定到浏览器后，会有一个弹窗，按你的要求设置一下。
Axure实现导航栏的展开与收缩
LAO__LIN的博客
04-12 1713
使用场景一般是B端后台系统需要以导航栏的展开与收缩实现原型的动态交互，主要使用区域是左边或者顶部的导航栏展开与收缩，同一级导航下的小标题，放在一起既美观又节省时间。
【Axure 教程】中继器中级教程-顶部导航
最新发布
ofay
09-03 544
通过上一次的左侧导航教程，相信大家已经知道通过中继器怎么制作左侧导航了，今天我们来试试另外的方式，来实现顶部导航吧~
Idea初步介绍
月亮投递员的博客
10-08 505
Idea安装与基本操作前言Idea安装Idea的常用快捷键总结 前言 今天博主为大家分享的是Idea的安装以及Idea中一些常用的快捷键！ Idea安装 Idea也是众多开发开发人员常用的开发工具之一，接下来让我们一起看看Idea的安装过程吧！ Idea官网链接 这里博主使用的是2018年的Idea版本 Idea安装初始页面 选择安装位置，点击Next 选择电脑位数 Idea的常用快捷键 总结 ...
Axure RP 10制作导航栏指示效果
Peppaaa的博客
05-31 696
本文介绍了如何用Axure RP 10制作导航栏指示效果。
Axure导航栏
weixin_44540247的博客
12-17 1211
导航栏在项目中是一个比较常见的模块，经常用作为功能模块分类的一个菜单。通过鼠标移入或者点击展开当前导航模块的功能列表。 最鲜明的例子就比如Axure软件的菜单栏。 通过鼠标移入或者点击都会展开当前分类，要使用Axure来制作这样一个案例也需要两点：布局和交互用例，下面将通过这个导航栏栏案例来做演示。 导航栏样式布局： 样式布局可以有几种方式，可以直接截图使用图片，再在对应分类上加元件；也可以直接制作一个相同样式（演示使用图片）。 首先将图片截取好，然后添加图片元件将该图片引入其中。 再在每个分类上添加一
axure页面向下滚动导航栏固定在顶部
学而不思则罔 思而不学则殆
11-20 3187
我们要实现的是，操作成功后，在最上面弹出操作成功的提示。即使页面滚动到下面，也会在屏幕最上方弹出操作成功。 实现方式如下： 在放消息的页面，绑定窗口滚动事件 ...
Axture RP9实现动态导航栏
2301_76794079的博客
06-27 1073
4，主导航栏选择新建交互-单击时-显示隐藏-选择元件（为之前动态面板）-选择切换-动画效果按照自己想法设置-确认。完成简单交互，如图所示。2，将子导航栏全选，并按鼠标右键，转化为动态面板，给动态面板加一个名字（方便后续选择），并将动态面板隐藏，如图所示。3，在主导航栏这一项选择交互，按照自己想法添加元件样式。实现动态导航方法很多，简单介绍一种。1，如图做好自己想要做到导航栏。此帖子为作者学习经验记录。
【Axure9案例】如何制作网站顶部导航栏
PEXUE的专栏
04-28 716
导航栏的一个特点是每个导航菜单都是互斥的，一次只能选中一个，当选中另一个菜单的时候，前一个被选中的菜单会取消选中，所以这里涉及到一个重要的知识点是“选项组” 知识点 l选项组 l交互样式：鼠标悬停、选中 l鼠标单击时事件 操作步骤 1、将矩形拖入面板中，调整大小宽度后，复制几个，做成如下图样式 2、设置选项组，全选所有菜单，鼠标右键，选择选项组 ​ 3、输入选项组名称，这个名称可以随意选取，注意：如果在原型中有多个这样的选项组，需要取不同的名称，不然会.
axure后台示例_技巧分享：Axure后台组件制作的全过程
weixin_39599454的博客
12-21 232
大家好，前一段时间我刚刚分享了一篇《打造高品质Axure组件库就是这么简单》，意在分享给大家一个完整的打造axure组件的思维路径。本文着重于整体制作的技巧思路分享，希望大家通过本文的阅读能够学到对自己有用的知识。一、组件构建思路1.1 确定模块确定制作大模块类别，这边我将WebKit后台组件分为了以下9大模块：1.2 细化各个模块内容根据1.1定义的9大模块，对每个模块进行模块细分，这个结构定义...
Axure顶部菜单吸附效果
06-30
Axure顶部菜单吸附效果(点击上传资源即表示您确认该资源不违反资源分享的使用条款，并且您拥有该资源的所有版权或者上传资源的授权)
axure7导航菜单.rp
07-20
导航菜单
Axure左边菜单，右边显示内容案例
03-29
Axure8.0制作选择左边菜单栏，右边显示相关内容案例，相关详细图文操作，可以参考博客内容：http://blog.csdn.net/ffacffac/article/details/67639914
一个很简易的导航菜单栏，支持左右滑动！
08-22
一个很简易的导航菜单栏，支持左右滑动！ 无意中在群里看到水友问是否有这样的demo，自己正好也闲暇无事写了一下，真的很简单的。望采纳 。谢谢！
axure资源案例：伸缩导航菜单
07-11
axure资源案例：伸缩导航菜单.这是一个简版的构想，传达一种思路。
20套Axure原型图线框图RP源文件模板素材图.zip
06-15
吸附式导航在滚动时固定在屏幕顶部，而折叠菜单则有助于在有限的空间内展示更多的导航选项。理解这两种交互方式可以帮助优化网站的可导航性，提升用户在不同屏幕尺寸设备上的使用体验。 "侧边栏推拉菜单原型"通常...
axure 怎么做导航吸附？
东东不邪的专栏
11-23 3970
导航一开始没有在屏幕最上方，鼠标滚动，导航会吸附到屏幕上边缘。不要回复动态面板pin to browser这种简单的答案。
axure 发布后隐藏顶部菜单 或展开顶部菜单
Z_hhhha的博客
07-29 955
这样可以实现菜单栏最小化，而且在你鼠标不移动到左上角时，小箭头会隐藏，效果就可以了。axure9.0版本在发布后HTML页面打开时总是在顶部弹出菜单既不美观也影响效果。本人axure小白，摸索半天后发现也不能完全关闭或者不显示(除非代码修改)；解决方案就是在请求地址后面拼接。...
Axure变量应用：制作丰富交互效果与简易计算器
在内容导航中，除了变量的使用，还包括了变量值在页面间的传递。这是原型设计中动态数据流动的关键，可以模拟实际应用程序中的数据流动情况。例如，登录页面的状态（如用户名和密码是否正确）可以通过全局变量传递到...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值