相对div在滚动时通过固定div

我在页面的顶部有一个固定的定位div。（例如Facebook）以及页面中相对定位的div。当我向下滚动时，相对div正通过固定div。我希望它通过固定格。有什么想法来处理这个？相对div在滚动时通过固定div

enter image description here

#navcontainer 
{ 
    position:fixed; 
} 

.city 
{ 
    position:relative; 
    float:left; 
} 

.city .text 
{ 
    position:absolute; 
    top:100px; 
    left:15px; 
}

在这个CSS我有一个城市的div和绝对文本正坐在这是相对的div的图像（。市）

来源

2012-04-24 Mtok

您好我想你应该这样做：

CSS

#navcontainer 
{ 
    position:fixed; 
    background:red; 
    left:0; 
    right:0; 
    top:0; 
    height:100px; 
    z-index:3; 
} 

.city 
{ 
    position:relative; 
    background:green; 
    left:0; 
    right:0; 
    padding:10px; 
    top:100px; 
    z-index:2; 
} 

.city .text 
{ 
    padding:10px; 
    background:yellow; 
}

HTML

<div id="navcontainer">This is navigation</div> 

<div class="city"> 
    <div class="text">here text <br />here text <br />here text <br />here text <br />here text <br />here text <br />here text <br />here text <br />here text <br />here text <br />here text <br />here text <br />here text <br />here text <br />here text <br />here text <br />here text <br />here text <br />here text <br />here text <br />here text <br />here text <br />here text <br />here text <br />here text <br />here text <br />here text <br />here text <br />here text <br />here text <br />here text <br />here text <br />here text <br />here text <br />here text <br />here text <br />here text <br />here text <br />here text <br />here text <br />here text <br />here text <br />here text <br />here text <br />here text <br />here text <br />here text <br />here text <br /></div> 
</div>

现场演示http://jsfiddle.net/xLnKN/1/

来源

2012-04-25 11:46:38