0

所以我有一个简单的无序列表：

<ul id="nav">
<li>
    <span>Group 1 »</span>
    <ul>
        <!-- list items -->
    </ul>
</li>
<li>
    <span>Group 2 »</span>
    <ul>
        <!-- list items -->
    </ul>
</li>
</ul>

我已经为这个菜单设置了样式，并添加了一些 jQuery 以ul在用户单击该span区域时显示 2nd level 并且span's 被设置为块级，因此您可以单击列表项内的任何位置并具有预期的功能。

问题是，在用户单击 span 元素并出现无序列表后，span 就像一个内联元素，并且要消失，ul用户必须单击文本并且单击 parent-li 区域将不起作用。

你可以在这里看到现场演示：http: //jsfiddle.net/d2Z7m/6/

也许有更好的解决方案来创建垂直菜单，但我只是想弄清楚为什么span元素会这样以及是什么原因造成的。

4

2 回答 2

1

将您的样式更改#nav li ul为

#nav li ul {
    width:100px;
    margin: -35px 0px 0px 155px;
}

目前填充正在影响span标签。

于 2012-09-25T13:54:42.433 回答
0

添加到您的跨度position:relative

于 2012-09-25T13:55:09.810 回答