擴展一個空白div的頁面長度

我有兩個div設置爲100像素絕對位於頁面的左側和右側。我有一個內容部分保證他們之間。當您從較大頁面的頂部到底部滾動時，我希望圖像隨頁面滾動。在我的網站中有七個不同大小的頁面，我正在嘗試使用CSS來完成這項工作。誰能幫我？擴展一個空白div的頁面長度

來源

2010-11-16 Robert Frey

你是說你想讓圖像保持原位而不移動？另外，你們可以分享CSS中的問題以及顯示你想克服的問題的基本頁面嗎？ ~~ http://stackoverflow.com/questions/how-to-ask – jcolebrand 2010-11-16 23:19:56

看看css的定位。

position:fixed; top:0px; left:0px;

在這裏看到：http://limpid.nl/lab/css/fixed/left-sidebar-and-right-sidebar

來源

2010-11-16 23:25:05 superUntitled

應該指出的是，position：fixed在IE6中不被支持，並且不適用於像iPhone這樣的移動設備（在這些情況發生的情況下問題）。 – RussellUresti 2010-11-16 23:28:25

謝謝，所提供的鏈接有更好的方式來處理手持設備等。 – superUntitled 2010-11-16 23:32:51

Here是可以解決你的問題的例子。

它使用background-attachment：fixed;但是您也可以使用position：fixed attibute，具體取決於您希望圖像在元素中是靜態還是滾動頁面。後臺選項的問題是它需要你爲它設計一個背景圖片，但它會起作用。

編輯：Here是一個關於固定定位和跨瀏覽器兼容性的優秀帖子。

來源

2010-11-16 23:29:46 JonVD

我有他們在一個div中，我設置的屬性固定，但我已定位div的位置：絕對;屬性。我需要外部div來匹配內容div的高度，然後根據頁面的長度，讓背景圖片隨頁面一起滾動。 – 2010-11-18 03:59:48

我看到你的問題，這些東西可能有點討厭。如果你可以發佈你的div和css的簡化版本，這將有助於提供一個解決方案=）在此期間，我閱讀了關於這個問題的一個偉大的職位，並已將其添加到我的答案的編輯部分。 – JonVD 2010-11-18 13:29:49

<div id="image1"> 
</div> 

<div id="image2"> 
</div> 

#image1 { 
    position: absolute; 
    width: 100px; 
    top: 0; 
    left: 0; 
    padding: 0; 
    margin: 0; 
    background-image: url(../media/warlock.jpg); 
    min-height: 100%; 
    height: 100%; 
    background-position: center; 
    background-attachment: scroll; 
} 

#image2 { 
    position: absolute; 
    width: 100px; 
    top: 0px; 
    right: 0px; 
    padding: 0; 
    background-image: url(../media/paladin.jpg); 
    min-height: 100%; 
    height: 100%; 
    background-position: center; 
    background-attachment: scroll; 
    background-repeat: repeat; 
}

這基本上是雙方的代碼。他們完全沒有任何東西，但我想滾動頁面的長度的背景圖像。

來源

2010-11-19 00:00:12 Robert

擴展一個空白div的頁面長度

回答

相關問題