Axure原型工作如何制作顶部吸附交互效果
我们在日常浏览网页的时辰，会发现上面的导航栏一向连结不动，而下面的内容会跟着滚动条的拖动而滑动，这个结果就是所谓的顶部吸附的结果，下面小编就介绍一下Axure原型工作若何建造顶部吸附交互结果。
东西/原料
- 电脑
- Axure
方式/步调
- 1
起首新建一个空白页面，在工作区域拖入本次要利用的元件元素，几个矩形和几个动态面板就可以了，如下图所示。
- 2
然后我们对元件元素的样式进行调整，并对里面的描述文字进行编写，如下图所示。
- 3
这一步需要对两个动态面板的名称进行设置，一个是上面的信息展示，一个是下面的导航信息，如下图所示。定名没有要求，想叫什么都可以。
- 4
打开动态面板，将两个矩形复制到动态面板中，如下图所示。
- 5
下面一步需要将两个动态面板的固心猿意马到浏览器这一项进行设置，程度要固心猿意马到居中位置，垂直要在上，如下图所示。
- 6
元件相关样式及属性设置完当作后，起头对交互事务进行设置，这里需要给页面插手交互事务，起首是第一个判定前提，利用函数判定窗口距离，如下图所示。
- 7
然后设置第一个动态面板移动的绝对位置，如下图所示。
- 8
然后设置第二动态面板埋没，如下图所示。
- 9
同上的体例，做第二个判定前提，并对两个动态面板的交互进行设置，如下图所示。
- 10
最后一步，因为是窗口滚动的结果，所以需要再拖入一个矩形，并将矩形拉长一些，如许浏览的时辰窗口就有滚动条了，如下图所示。
- 11
好了，工作筹办完当作，f5预览一下结果，试着滚动鼠标，这些信息栏会消逝，导航栏会吸附到最上面。
注重事项
- 这个结果的方式相对较难，需要用到函数
- 同样需要节制好位置，多加操练就会知道了
- 更多好玩的Axure经验接待存眷小编一路进修
- 发表于 2018-12-18 00:00
- 阅读 ( 756 )
- 分类：其他类型
admin
0 篇文章
作家榜 »
-
xiaonan123
189 文章
-
汤依妹儿
97 文章
-
luogf229
46 文章
-
jy02406749
45 文章
-
小凡
34 文章
-
Daisy萌
32 文章
-
我的QQ3117863681
24 文章
-
华志健
23 文章