当前位置:主页 > www.410033.com >

本港台Axure教程|如何制作返回顶部原型功能?

发布日期:2019-09-26 06:23   来源:未知   阅读:

  六开彩开奖现场直播 开奖结果上述广州仓库管理系统哪家好挂牌,1、在工作区拖入一个动态面板命名为top,根据通常返回顶部的按钮在屏幕右下角的惯例设置top的X坐标和Y坐标,并在状态1(stage1)里插入一张返回顶部的图片,然后将动态面板top设置“固定到浏览器”,最后设置为隐藏备用。

  2、再拖入一个动态面板命名为top_2,Y坐标与动态面板top一致,X坐标任意,但是不要与top重叠(我是直接将top_2放在了top的平行左边的位置),且top_2中不放入任何元件,然后将动态面板top_2设置“固定到浏览器”后备用。

  3、拖入一个热区命名top_rq,X坐标与动态面板top_2的X坐标一致,Y坐标等于动态面板top_2的Y坐标加上动态面板top_2的高度(热区top_rq的Y坐标的设置不固定,看你的动态面板top想在页面滑动到什么位置开始显示自定义设置),宽度与动态面板top_2的宽度一致,高度直接拖到页面最底部。

  5、设置控件交互(返回顶部)拖入一个矩形命名top_mark,位置放在动态面板top的初始位置(即覆盖住top)。然后对动态面板top设置鼠标点击时事件。在弹出的窗口中,逐步进行:

  6、这样一个”返回顶部“的效果就做好了。点击F5预览,然后向下滑动下鼠标,在屏幕右下角就会显示返回顶部的按钮了,当返回顶部后,这个按钮又会消失不见。

  本文由 纪梦旭(微信号:sailalone001) 原创发布于人人都是产品经理 ,未经许可,禁止转载。

  3、针对第一步设置的动态面板,设置一个单击事件,用例中选择滚动到锚点(选个热区),设置隐藏用例,将动态面板隐藏

  4、设置页面滚动事件,增加一个判断条件,当页面滚动到某个距离,如900像素时(或者设置接触线),在显示动态面板

  1、可以反过来设置为接触时隐藏,未接触时显示,这样不用将top_rp下拉至页面底部了,只需要短短的一条,并且可以适用各种高度的页面;

  2、可以将4个原件组合,本港台。在需要应用的页面上,直接黏贴过去,并将页面交互也黏贴过去(正因为页面交互是在每个页面单独设置的,所以没找到实现模版套用的方式)

  人人都是产品经理(是以产品经理、运营为核心的学习、交流、分享平台,集媒体、培训、社群为一体,全方位服务产品人和运营人,成立9年举办在线+期,线+场,产品经理大会、运营大会20+场,覆盖北上广深杭成都等15个城市,在行业有较高的影响力和知名度。平台聚集了众多BAT美团京东滴滴360小米网易等知名互联网公司产品总监和运营总监,他们在这里与你一起成长。