现场报码开奖直播Axure教程:页面滚动时导航菜单

发布时间: 2019-11-17

  如何让页面的导航菜单在滚动时也可见呢?笔者以此为需求,讲解了如何用Axure实现这个需求。

  不知大家在某东官网买书浏览网页的时候,有没有发现这样一种很有趣的现象:在书籍详细页面,页面最上面一般是展示图书相关图片以及价格等信息,再往下就是图书更详细的信息。通常会有这4部分内容分别以Tab页签的形式展示,如商品介绍,规格包装,售后保障以及商品评价。

  每类的详细信息都比较多,当我们想要了解更多信息的时候,我们就会向下滚动鼠标,正常来说滚动的距离超过页签原本高度的时候,这4个Tab页签就会消失不见的。但是我们会发现:这4个Tab页签始终可见并且始终的页面的最上面。

  通过上面的描述,相信大家比较了解需求了。话不多说,我们再来梳理一下需求,深入分析需求。11149香港马会资料大全精选PPT模板:唯美女性SP

  这个需求可以浓缩简化为以下:页面某些中菜单栏,在鼠标滚动的距离超过其原本高度的时候仍在界面显示,现场报码开奖直播,并且显示在页面的最上面。

  浓缩为Axure语言就是:鼠标滚动的距离超过某元件原本高度的时候仍在界面显示,并且显示在页面的最上面。

  这个案例中涉及页面的滚动,页面滚动时仍需要判断页面滚动的距离,当页面滚动的距离大于等于动态面板的原本高度时,则将其移至页面最上面即当前的页高度,这里是绝对距离;否则不移动。

  判断页面的高度,需要用到窗口高度函数, [[Window.scrollY]];4个标签动态面板的y坐标轴为400。

  2019年十大骗局:私域流量、区块链、下沉市场

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