答案家

 找回密码
 立即注册
查看: 667|回复: 0

JavaScript悬浮层树(Tree)菜单_js源码下载

[复制链接]

1万

主题

1万

帖子

81万

积分

校长

Rank: 9Rank: 9Rank: 9

积分
817252
发表于 2016-11-28 16:20:43 | 显示全部楼层 |阅读模式
悬浮层树(Tree)
这种树结构实现类似面包屑导航功能,监听的是节点鼠标移动的事件,然后在节点下方或右方显示子节点,依此递归显示子节点的子节点。

用户首页博客设置文章相册留言评论系统
这里要注意几个小问题,其一这种树结构是悬浮层绝对定位的,在创建层的时候一定要直接放在body的下面,这样做的是确保在IE里面能遮掩住任何层,因为在IE里面是有stacking context这种东西的潜规则在里面的,另外当然还有一个select你能遮住我吗?老掉牙的问题,这里是采用在每个悬浮层后面加个iframe元素,当然同一级的菜单只产生一个iframe元素,菜单有几级将产生几个iframe遮掩,然后菜单显示和隐藏的时候同时显示和隐藏iframe。

不过这种菜单并不合适前台,因为目前只支持在脚本里动态添加菜单节点,而不能从现有的html元素获取菜单节点,我们为了SEO等前台导航一般是在后台动态输出的,假如菜单有多级的话也建议不超过2层,对客户来说太多层也懒得去看,不过有个面包屑导航显示还是很不错的。


完整源码请下载附件,回复帖子即可查看解压密码:
游客,如果您要查看本帖隐藏内容请回复



游客,如果您要查看本帖隐藏内容请回复
QQ截图20161128162143.png
回帖码请关注我们的公众号获取。

请在电脑访问我们的网站下载答案,手机下载可能会造成答案不正常显示!QQ群1097987313公告有详细步骤。

该答案由网友整理提供,如果答案不符请扫描关注我们的公众号反馈给我们。

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

CopyRight(c)2016 www.daanjia.com All Rights Reserved. 本站部份资源由网友发布上传提供,如果侵犯了您的版权,请来信告知,我们将在5个工作日内处理。
快速回复 返回顶部 返回列表