新闻中心

详细内容

Axure教程:顶部导航光标定位

  当鼠标移入顶部菜单时,菜单顶部有光标跟随,当移出时,光标自动回到当前页面菜单位置。这种效果应该怎么实现呢?

  当鼠标移入顶部菜单时,菜单顶部有光标跟随,当移出时,光标自动回到当前页面菜单位置。这种效果应该怎么实现呢?

  如下图:

  

  顶部导航光标定位

  线上效果图,查看:顶部导航光标定位

  制件方法 1. 页面与导航栏制作

  按平时制作导航与页面的方式制定,先制作好页面与导航栏。

  2. 菜单动态面板

  添加动态面板,放在导航栏位置。

  

  菜单动态面板

  3. 制作菜单

  进入动态面板,添加4个菜单,并添加光标,并放置于菜单一位置。

  

  菜单制作

  4. 菜单一交互

  针对每个菜单单独做交互效果,菜单一交互设置。

  

  菜单一交互

  在菜单一的交互中添加全局变量”blue”,并设置值为“菜单一”。

  

  变量值设置

  5. 菜单二交互

  菜单二交互设置:

  

  菜单二交互

  在菜单二的交互中添加全局变量“blue”,并设置值为“菜单二”。

  

  变量值设置

  其余菜单按以上方法进行设置。

  6. 动态面板页面交互

  在动态面板页面做鼠标移出时的交互效果:

  

  鼠标移出交互

  7. 母板

  多个菜单页面,可将制作的菜单转换为母板,其余3个菜单页面可直接使用。

  

  母板

  8. 主页面交互设置

  在主页面设置页面载入时的交互:

  页面载入设置

  本文由 @ 五百英里 原创发布于人人都是产品经理。未经许可,禁止转载

  题图来自Unsplash,基于CC0协议

在线表单提交
更多
您的姓名
联系方式
留言内容

在线留言 / 我们的客服人员收到您的留言后将第一时间向您取得联系

传真:(0755) 29939876

联系电话:0755-29939993  29939994

24h销售热线:13828818369

24h售后服务热线:13590149467



email:mindray@126.com

地址:深圳市宝安区沙井镇新桥第三工业区金元二路19号

Copyright @ 2018 . All rights reserved. 

技术支持: 凡客科技 | 管理登录
seo seo