Question

我在将这个z-index放在另一个div之上时遇到了问题。我怎么能这样做，当它向下滑动它滑过该div。如果你想看一个例子我可以通过聊天告诉你。基本上下拉框是在它下面的另一个div下面，但我希望它悬停在它上面。

<style type='text/css'>
#content {
    margin: auto 0;
    margin-left: 10px;
    width: 240px;
    border-left: 10px solid #6280c1;
    border-right: 10px solid #6280c1;
    text-align: center;
    padding: 100px 0px 100px 0px;
    display: none;
}
#bottom {
    width: 280px;
    height: 81px;
}
</style>
<script type='text/javascript'>//<![CDATA[ 
$(window).load(function(){
$('#bottom').toggle(

function() {
    $('#content').slideDown();
}, function() {
    $('#content').slideUp();
});
});//]]>  

</script>

<div id="content">CONTENT</div>
<div id="bottom"><img src="../images/drop_fb.png" width="280" height="81"></div>

Answer 1

将position:absolute;添加到#bottom div会使其保持在#content div之上。

#bottom {
    position:absolute;
    top:0;
    left:0;
}

Answer 2

您必须将position:absolute添加到您希望按z-index定位的每个div，否则这将无效。

使用iframe的下拉菜单不起作用

2 个答案: