如何將div浮動到一邊並在滾動時使其粘貼

因此，我有一些隱藏的div，但是當您單擊帶有與div類對應的id的跨度時會顯示。我有這個公園的工作，它會顯示divs，但我有一個長長的事物清單脫離頁面。我希望隱藏的div可以粘到屏幕的頂部，這樣，如果用戶點擊遠處的鏈接，他們不必一直滾動到頂部以便看到它。這裏有一些代碼應該讓你知道我在做什麼。如何將div浮動到一邊並在滾動時使其粘貼

HTML：

<div id='container'> 
    <div id='nav'> 
     Nav things 
    </div 
    <div id='main'> 
     <span class='clickme' id='1'>Thing 1</span> 
     <span class='click me' id='2'>Thing 2</span> 
     Etc.. 
    </div> 
    <div class="div_class 1'> 
     Explanation of Thing 1. 
    </div> 
    <div class='div_class 2'> 
     Explanation of Thing 2. 
    </div> 
</div

CSS：

#container 
{ 
    margin: 0px auto; 
    width: 90%; 
} 
#nav 
{ 
    float: left; 
    width: 15%; 
} 
#main 
{ 
    float: left; 
    width: 15%; 
} 
.div_class 
{ 
    float: right; 
    display: none; 
}

我已經試過 'posistion：固定' 在div_class類但這使文成左上角重疊的資產淨值股利。然後我嘗試添加填充，但是這使得div重疊了一些鏈接，並使它們不可點擊。

來源

2013-05-21 Ian

爲了讓位置固定，你需要有另一個div，它的位置是相對的，對於div id = nav，你可以指定position：absolute;然後調整頂部，左側和右側。你也可以嘗試使用z-index：100。 – argentum47

您正處於正確的軌道上position: fixed。你只需要告訴元素哪裏去：

#floater { 
    position: fixed; 
    top: 0; 
    right: 0; 
}

調整top和right（或left和bottom，如果你願意的話）根據需要避免重複您的導航div中。

請參閱this JSFiddle以進行裸機演示，並使用this one以及導航欄。

來源

2013-05-21 20:11:08

如何將div浮動到一邊並在滾動時使其粘貼

回答

相關問題