【无标题】

这篇博客介绍了如何创建一个交互式的导航菜单,通过鼠标点击实现二级菜单的显示和隐藏。内容包括使用矩形和垂直菜单构建导航,设置初始隐藏状态,以及通过鼠标单击事件控制菜单的滑动显示和隐藏。此外,还详细讲解了如何实现点击一个导航项时,其他导航项的二级菜单自动隐藏,提供了一种有效的页面交互设计方法。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

显示和隐藏

第一个操作:

目标:制作一个导航,点击的时候出现二级菜单,再次点击的时候,二级菜单消失,再次点击的时候,二级菜单出现。。长的大概就是下面这个样子了

 

1.导航一用矩形画出来,二级菜单使用菜单与表格中的垂直菜单

2.选中二级菜单,设置为隐藏,注意,记得给二级菜单命名

 

3.设置鼠标单击事件,显示时,让其从上向下滑动;隐藏时,从下往上

 

第二个操作:

目标:制作三个导航,每个导航有个二级菜单,当点击导航一的时候,导航二和三的二级菜单隐藏;当点击导航二的时候,导航一和三的二级菜单隐藏,以

 

1.画出三个导航,并设置二级菜单为隐藏,此处不赘述。值得注意的是,需要为每个导航的二级菜单命名

 

2.鼠标单击事件中添加隐藏,配置的动作是需要隐藏的菜单,即如果点击的是导航二,则配置动作出选择的应该是导航一的二级菜单导航二的二级菜单。动画选择向上滑动

 

3.告诉你一个好消息,发布就可以看到你想要的效果啦

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值