2

代码：http: //jsfiddle.net/TwCLr/

如果你想看看我想要完成什么，请跳到这篇文章底部的链接。

我在水平子菜单设计中遇到定位问题以及 z-index 问题。

我想这整个过程可以通过 jquery 来处理（甚至可能是必要的）。如果有人有一个可以在这里工作的脚本，我很乐意听到关于此的建议。

我还应该提到菜单的 html 是用 wordpress 生成的。如果我想更改那部分，我需要重写调用菜单的函数。

函数.php

function conceptx_setup() {
register_nav_menu( 'primary', __( 'Primary Menu', 'conceptx' ) );}
add_theme_support( 'menus' );

导航html

<?php wp_nav_menu(); ?>

如果这里有一个不需要更改 html 部分的解决方案，那将是理想的。我已经在帖子顶部的 jsfiddle 链接中写出了 wordpress 生成的结构。

以及它应该如何运作的快速而肮脏的 gif：http: //i.imgur.com/ptYeZDg.gif

如果有人可以提供帮助，我将不胜感激。

4

1 回答 1

0

你在找这个吗：小提琴

添加/更改 CSS

.menu .menu-item:hover .sub-menu {
    top: 82px;
}

.menu .menu-item .sub-menu {
    position: absolute;
    left: 0;
    top: 16px;
    z-index: -1;
    width: 100%;
    transition: all .5s;
}

.menu .menu-item .sub-menu .menu-item a {
    opacity: 1 /* just remove opacity: 0*/
}

编辑：居中的菜单

在这里提琴

此处全屏

于 2013-05-31T21:27:58.960 回答