多级导航选项卡

Question

我正在尝试创建一个非常复杂的导航菜单，它看起来像这样：

基本上它是一个3级导航栏，有2个父标签，当您将鼠标悬停在任何标签上时，您应该能够看到其子导航级别，当您将鼠标悬停时，您会看到您当前所在的位置。

另一个问题是两个父标签有两个不同的颜色主题，父标签1为蓝色，所有子级别为蓝色，父标签2为绿色等。

我对如何做到这一点非常困惑，也许是嵌套的div？ 是否有任何插件可能会让我的生活变得更轻松？

Answer 1

许多样本都可以在互联网上使用，但您需要根据您的要求进行修改。 一些例子是可用的：

http://jsfiddle.net/elusien/PayFw/8/

http://snippets.aktagon.com/snippets/200-Really-simple-hover-menus-with-jQuery

http://www.webresourcesdepot.com/wp-content/uploads/file/jquery-sliding-menu/#

Answer 2

像 jQuery Drop Line Tabs 之类的东西可能适用于这种情况。它是一个jQuery插件，允许您在问题的图像中进行多级导航。这是一个插件的链接（如果您想查看该页面，还有该页面上的现场演示）：jQuery Drop Line Tabs。

如果这样做不成功...在线搜索会带来很多menu plugin tutorials。

希望至少让你指向插件的方向......！