贵妃网贵妃网

贵妃网 - 时尚原创门户网站
www.962068.com
文章96378浏览16180376本站已运行6113

Axure RP8 教程:实现高逼格的面板切换效果

原标题:Axure RP8 教程:实现高逼格的面板切换后果

若何应用Axure RP8 教程实现高逼格的面板切换后果呢?一路来文中看看~

浏览网页时,我们经常看到整屏滚动后果的首页设计,如招商银行首页:当鼠标高低滚动时,不合页面进行翻页展示。

此教程将讲解若何实现此后果:

最后想到经由过程添加另一个动态面板,定名为【控制面板】,设置宽高与内容面板一致,为其内容添加一个长高度的热区,即能使面板出现滚动条。再添加【向上滚动时】和【向下滚动时】的交互事宜来控制【内容】动态面板的切换。后果如下:

一、界面元件搭建

起首,拉入一个动态面板,定名为“内容”,再为其添加2个动态,为这三个状况面板的添加一些元件,(状况里面的元件内容随大年夜家爱好自行添加,主如果演示面板的切换后果),本教程的动态面板界面后果如下:

预览后果如下:

起先的设法主意,是想在【内容】动态面板上,添加【向上滚动时】和【向下滚动时】的交互事宜;然则,因为面板的内容宽高是自适应的,没有出现滚动条,是以,鼠标的滚动事宜无法触发。

接下来,我们只须要将此这控制面板的滚动条隐蔽即可,实现办法为:将此动态面板再转化为动态面板,将此动态面板的宽度削减20,即少去滚动条的宽度。最终的实现后果如下:

作者:火星人~艾斯,"大众,"号:艾斯的Axure峡谷

本文由 @火星人~艾斯 原创宣布于人人都是产品经理。未经许可,禁止转载

二、交互事宜实现

题图来自Unsplash,基于CC0协定

赞一下
贵妃网
上一篇: 10年陈旧颈椎、肩颈病“电”一下,止痛!舒服新体验
下一篇: 首药控股:第三代 ALK 抑制剂正式开始一期临床试验

相关推荐

隐藏边栏