相對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