码云笔记前端博客
Home > 产品教程 > 【axure教程】不用中继器如何实现手风琴下拉菜单效果

【axure教程】不用中继器如何实现手风琴下拉菜单效果

2018-06-23 分类:产品教程 作者:管理员 阅读(9399)

本文共计478个字,阅读时间预计2分钟,干货满满,记得点赞加收藏哦

最近在做项目时需要做一个左侧下拉式的手风琴菜单,在网上搜集了很多有关axure实现资料,发现都是利用中继器做出来的,步骤有点繁琐,有没有更好的实现方式呢?不用中继器能实现吗?在经历了一番思考学习,下面把我的实现方式总结给大家,供大家参考学习。这里我用的是axure8,

准备工作

在面板上绘制两个按钮,命名为菜单一、菜单二,然后再绘制两个动态面板,面板内填充一些可以区别的内容,这里我把它们命名为内容一、内容二。

【axure教程】不用中继器如何实现手风琴下拉菜单效果

将菜单与内容一一对应放置,然后将动态面板设置为隐藏,如图:

【axure教程】不用中继器如何实现手风琴下拉菜单效果

接下来是重点实现的方法,我们以菜单一为例,其他的方法以此类推。

先选中菜单一,添加鼠标点击效果,将内容一设置为“切换可见性、推动/拉动元件、下方”,然后选择内容二设置为“隐藏、推动/拉动元件、下方”,如图:

【axure教程】不用中继器如何实现手风琴下拉菜单效果

菜单二设置方法和菜单一实现的方法一样,需要我们注意切换的是当前标题对应的动态面板,隐藏的是其他标题的动态面板

【axure教程】不用中继器如何实现手风琴下拉菜单效果

这样设置完之后就可以预览一下效果

【axure教程】不用中继器如何实现手风琴下拉菜单效果

以上就是今天为大家带来的axure如何实现手风琴下拉菜单方法,就是利用切换可见性,实现起来简单粗暴,节省了大量时间。如果你有更好的方法欢迎交流。

 

「除特别注明外,本站所有文章均为码云笔记原创,转载请保留出处!」

赞(5) 打赏

觉得文章有用就打赏一下文章作者

支付宝
微信
5

觉得文章有用就打赏一下文章作者

支付宝
微信

上一篇:

下一篇:

你可能感兴趣

共有 0 条评论 - 【axure教程】不用中继器如何实现手风琴下拉菜单效果

博客简介

码云笔记 mybj123.com,一个专注Web前端开发技术的博客,主要记录和总结博主在前端开发工作中常用的实战技能及前端资源分享,分享各种科普知识和实用优秀的代码,以及分享些热门的互联网资讯和福利!码云笔记有你更精彩!
更多博客详情请看关于博客

精彩评论

站点统计

  • 文章总数: 476 篇
  • 分类数目: 13 个
  • 独立页面: 8 个
  • 评论总数: 228 条
  • 链接总数: 15 个
  • 标签总数: 1050 个
  • 建站时间: 525 天
  • 访问总量: 8648342 次
  • 最近更新: 2019年11月21日