在滾動時強制圖像滾動到頁面的底部（不隨用戶滾動）

所以我有一個圖像我想要位於頁面的左下角。如果頁面底部在加載時不可見，我希望用戶必須向下滾動才能看到它。每次我試圖查看這些，每個人都希望他們的圖像與用戶滾動，而這不是我想要的。在滾動時強制圖像滾動到頁面的底部（不隨用戶滾動）

這裏是我當前的.css

#backgroundImageOne{ 
    position: absolute; 
    bottom: 0px; 
    left: 0px; 
}

然後我在佈局像這樣實現：

<body> 
    <div style="height:100%"> 
    <div id="placeHolder"> 
     <div id="backgroundImageOne"> 
     <img src="/images/background1.png" 
     </div> 
    </div> 
    . 
    . 
    . 
</body>

任何關於如何在的底部使這個逗留幫助或提示所有的頁面都會非常有幫助。謝謝。

來源

2014-12-07 Cameron Jones

設置爲position: relative;與CSS的身體。這應該工作。

來源

2014-12-07 22:40:39 redelschaap

我也試過這個。但是，它會將其鎖定到頁面加載時我可以查看的底部，而不是頁面的實際底部。然後當我向下滾動時，它會粘在頁面中間。 – 2014-12-07 22:48:10

您應該將該圖片與該圖片分離出來，並將其放置在正文標籤之後（正好位於正文標籤之前）。看看http://jsfiddle.net/jnzrko02/ – redelschaap 2014-12-07 22:52:08

好的。我也這樣做了，結果相同。是否有可能存在問題，因爲它的佈局不在實際頁面上？ – 2014-12-07 23:00:50

#backgroundImageOne{ 
    position: fixed; 
    bottom: 0px; 
    left: 0px; 
} 

<div id="backgroundImageOne"> 
    <img src="/images/background1.png"> 
</div>

來源

2014-12-07 22:41:09

當我設置爲固定時，圖像會隨頁面一起滾動。 – 2014-12-07 22:47:08

??看到這個http://jsfiddle.net/qh01deaz/ – 2014-12-07 22:57:23

如果你想讓用戶滾動頁面你可以顯示或隱藏#backgroundImageOne讀取scrollTop的值 – 2014-12-07 23:00:20

在滾動時強制圖像滾動到頁面的底部（不隨用戶滾動）

回答

相關問題