我正在尝试实现与哈佛网站类似的菜单行为:http://www.seas.harvard.edu/computer-science 无论您将鼠标放在哪个链接上,所有部分都会下拉。
有人知道他们用的是什么吗?我能找到的最接近的是 jQuery Superfish 菜单,但它只允许一次打开一个菜单部分。
提前谢谢您!
最佳答案
我创建了一个 demo on JSFiddle这描绘了我在评论中谈论的内容。您正在寻找的特定结果是对正常下拉菜单的简单修改。您不必将每个下拉列表作为自己单独的 div,而是将它们放入容器 div 中并在需要下拉列表时显示它。
所以代替:
<div id="drpDwn1"></div>
<div id="drpDwn2"></div>
<div id="drpDwn3"></div>
你会:
<div id="drpDwnFull">
<div id="drpDwn1"></div>
<div id="drpDwn2"></div>
<div id="drpDwn3"></div>
</div>
您可以更改 drpDwnFull
的可见性,而不是更改单个项目的可见性,以获得完整的菜单效果。
然后您可以根据需要添加突出显示。在我的演示中,我选择突出显示与菜单项关联的菜单,以及您悬停在其上的单个项目。
关于javascript - jQuery下拉导航菜单库一次打开全部,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24147710/