javascript - 菜单 css 和 javascript

Question

我现在有点困惑。首先，子菜单的宽度和高度看起来变形了。其次，javascript 不工作。它不会隐藏子菜单，只会在悬停时出现。更有趣的是，在我的website子菜单甚至根本不出现。我已经为此工作了一天多，但我似乎无法把它做好。

#navigation ul li.current-menu-item a, 
#navigation ul li a:hover { background: rgba(255,255,255,0.05); }

#navigation ul li ul {
    position: absolute;
    top: 58px;
    left: 0px;
    width: 200px;
    border: none;
    z-index: 1000;
    background: #D32828;
}

JS fiddle : http://jsfiddle.net/UX94c/1/

Answer 1

您使用 javascript 有什么特别的原因吗？它看起来像一个普通的下拉菜单，可以用纯 css 实现:

.main-navigation li .sub-navigation {display: none;}
.main-navigation li:hover .sub-navigation {display: block;}

*你必须使用正确的类，我的例子只是一般用途

我用基本用法创建了一个 fiddle :http://jsfiddle.net/YP5Dh/