使用jquery动画div时CSS z-index不起作用？

Can anyone help me make the red div roll OVER the blue paragraph?

任何人都可以帮助我在蓝色段落上进行红色div滚动吗？

I tried doing it with z-index, but couldn't make it work:

我尝试使用z-index，但无法使其工作：

div {
    z-index: 1;
}

p {
    background-color: blue;
    z-index: 0;
}

Sorry if this is a noob question.

对不起，如果这是一个菜鸟问题。

Thanks in advance!

提前致谢！

3 个解决方案

#1

You can position the <ul> or the <div> - e.g.

你可以定位

- 例如

ul {
background-color: yellow;
width: 100%;
height: 50px;
z-index: 1; /* z-index doesn't work on statically positioned elements */
position: relative;
}

http://jsfiddle.net/B3rQR/2/

#2

Sure, just add position:relative; to your div's rules. z-index only works on positioned elements.

当然，只需添加位置：相对;根据你的div规则。 z-index仅适用于定位元素。

jsFiddle example

jsFiddle示例

#3

add position: relative; in div

添加位置：相对;在div

#1