童话说说技术创业美文职业
投稿投诉
职业母婴
职场个人
历史治疗
笔记技能
美文纠纷
幽默家庭
范文作文
乐趣解密
创业案例
社会工作
新闻家居
心理安全
技术八卦
仲裁思考
生活时事
运势奇闻
说说企业
魅力社交
安好健康
传统笑话
童话初中
男女饮食
周易阅读
爱好两性

Axure教程:鼠标移入时切换菜单

9月17日 飞虹谷投稿
  上一篇文章《Axure教程:实现菜单下拉效果》里使用了最简单的方式实现了菜单下拉效果,这个案例实现的是当鼠标移入菜单项的时候切换菜单且有且只有一个菜单项是展开的。
  预览图
  鼠标移入“菜单2”后:
  预览地址:https:64y9da。axshare。com
  所需元件
  两个菜单矩形、两个菜单子项动态面板、一个向上箭头、一个向下箭头。
  操作步骤
  (1)设置“菜单1”矩形的第一个交互:鼠标移入时,让菜单变为选中状态
  (2)设置“菜单1”矩形的第二个交互:选中改变时,分两种情况去隐藏和显示动态面板
  1)Case1:当“菜单1”非选中时,隐藏“菜单1子项”动态面板:
  2)Case2:当“菜单1”选中时,显示“菜单1子项”动态面板:
  (3)同样地设置好矩形2的交互
  (4)将“菜单1”矩形和“菜单2”矩形设置成同一选项组
  (5)按F5预览原型看看
  小记
  1。这里可以“菜单1”矩形和“菜单2”矩形只用一个交互动作即实现鼠标移入切换菜单且有且只有一个菜单项是展开的效果。
  2。为什么不这样做?
  因为这个案例里就只有两个菜单,如果有10个,那你就得在显示一个菜单子项时将其他9个菜单子项隐藏起来,那就会非常麻烦而Axure提供的选项组功能在这里就可以派上用场。
  选项组的功能就是让在一个选项组里的所有元件有且只有一个是选中状态,利用这个功能就我们虽然多了一个交互但却节省了很多的工作。
  3。当你快速在两个菜单项里来回切换的时候会出现这种情况,可以去试试非常有趣哈哈:
  4。至于为什么会出现这种情况是因为在设置“菜单”矩形交互的显示隐藏效果时没有将动画效果取消掉,当你快速切换时,页面反应不过来就把矩形一直往下推了
  附上无bug原型地址:https:gx8op7。axshare。com
  相关阅读
  Axure教程:实现菜单下拉效果
投诉 评论 转载

建议收藏:可能是最全的Axure输入框今天给大家分享一组Axure常用输入框,喜欢该原型的小伙伴们可以在评论处给我留言哦。原型演示地址:https:www。pmdaniu。comstorages1110439……AxureRP9教程:页面三级拖动本期效果是一个三级拖动,第一次点击弹出部分列表,向上拖动时显示完整的列表,向下拖动时显示最低级的列表。一起看看怎么操作本期效果:本期效果是一个三级拖动,第一次点击弹……AxureRP9教程:制作漂亮的bootstrap4进度条作者给大家分享了如何使用Axurerp9制作bootstrap4进度条,一起来看看今天跟大家分享的是制作漂亮的bootstrap4进度条,老规矩能动手的不花钱买,不会的先……Axure教程:实现菜单下拉效果笔者在本文中介绍了如何用Axure实现菜单下拉效果的操作步骤,以及实现过程中的一些心得体会,与大家分享。尽管Axure的基础元件库里面已经有菜单项了,但是样式和交互我们不……Axure教程:鼠标移入时切换菜单上一篇文章《Axure教程:实现菜单下拉效果》里使用了最简单的方式实现了菜单下拉效果,这个案例实现的是当鼠标移入菜单项的时候切换菜单且有且只有一个菜单项是展开的。预览图……Axure教程:计数器的实战应用场景商品购件数本文将为大家介绍如何设计商品购件数的交互设计以及具体步骤。移动互联网购物平台已经成为时代的潮流,以“移动端下单前置仓配货即时配送到家”等模式运营,让用户足不出户即可买到新……Axure教程:实现商品规格选择功能这篇文章分别使用到了我先前的四篇文章:《Axure教程:实现商品分享功能》、《Axure教程:数量加减的实现》、《Axure教程:规格的实现》、《Axure教程:使用动态面板实……Axure教程:用中继器做APP引导页文章教大家如何在Axure用中继器做APP引导页,与大家分享。今天教大家用中继器做app的引导页,该原型使用方便简单,制作完成后,所有交互都已经设定好,您只需要在中继器中……Axure教程:数量加减的实现我的上一篇文章是《Axure教程:实现商品分享功能》,原本计划下一篇写的是《Axure教程:实现商品规格选择功能》,但在制作途中发现内容比较多,所以就先打算拆解开来分……Axure教程:规格的实现笔者在本文中介绍了如何用Axure实现规格效果的操作步骤,以及实现过程中的一些心得体会,与大家分享。这篇文章是继《Axure教程:数量加减的实现》之后的下一篇拆解《Axu……AXURE教程:手机键盘今天教大家用axure做一个能输入的手机键盘,该键盘原型,效果真实,可以打英文,数字和标点符号。一、效果演示演示地址:https:www。pmdaniu。comst……Axure教程:实现商品分享功能本文介绍了如何实现商品分享功能的Axure教程,并具体从预览图,到所需原件,再到操作步骤进行了分析。导语该案例是基于电商平台,当对商品进行分享时的原型制作。该原型内……
情绪渲染在产品设计中的作用产品经理,你是否给业务留了后路?十大技巧快速提升原生APP开发性能3种不友好的注册登录设计智能电视用户体验设计分享之焦点篇思路最重要!七大秘诀帮你设计出令人难忘的优秀网站译文UI动画中的微交互详解产品经理需要懂的技术丨3分钟了解个性化推荐算法图形设计的优势在于激发用户的好奇心译文交互设计的基本元素深度社交软件的直接交流和间接交流被误用的移动体验设计模式

友情链接:中准网聚热点快百科快传网快生活快软网快好知文好找作文动态热点娱乐育儿情感教程科技体育养生教案探索美文旅游财经日志励志范文论文时尚保健游戏护肤业界