jQuery丢失位置悬停:相对

Question

我用jQuery设计了一个下拉滑动菜单。当我在一个页面上添加

position: relative  
top: -18px

对于某些div元素，它们位于向下滑动的ul的顶部。在菜单中移动鼠标时，当我与这些元素相交时，jquery开始在菜单中向上滑动(似乎在移动ul时，我跳到了顶部的div，所以这是正确的)。我当然不想要这样的效果。我尝试添加z-index，但没有成功。

http://jsfiddle.net/2WHVT/ (我在date标签中添加了黑色边框，这会破坏菜单)。对不起，颜色和设计，我移动得很快，但重点是相同的。

也许你有什么想法？

Answer 1

你需要添加一个z-index来让你的li显示在最上面。

#menu ul li {
    border-right: 1px solid #820B0B;
    display: block;
    float: left;
    list-style: none outside none;
    margin: 0;
    padding: 0;
    position: relative;
    z-index: 1; /*add this*/
}

Answer 2

我已经在#menu ul CSS中添加了一个z-index，它似乎可以做到这一点。如下所示：

#menu ul
{
    padding: 0;
    margin: 0;
    z-index: 2;  //THIS IS WHAT I ADDED 
}

查看此处：http://jsfiddle.net/nayish/2WHVT/10/

Answer 3

#NewsDisplay .news .newsDate
{
    position: relative;
    top: -18px;
    display: inline-block;
    border: 1px solid black;
    height: 18px;
    width: 100%;
    text-align: right;
    color: Gray;
    z-index:-10;
}

这对我很有效。如果你有什么问题，请告诉我。