滾動在上述

-1

我試圖複製看到此頁面上的效果的DIV的頂部一個div：http://www.falve.co.nz/collection/滾動在上述

當你滾動頁面較深的英雄節下方滾動的白色部分過頂的頂部英雄部分，就像一個窗簾。

我該如何複製這個？這是一個jQuery的東西或CSS位置的東西？真的不確定如何處理這個？

來源

2013-09-24 egr103

jQuery來拯救！只需將文檔的'.scrollTop（）'位置以數學方式以平滑的方式重新排列其他文檔。 – CP510

@ CP510我不是在淡入或淡出頂部部分上方滾動的底部部分的滾動運動之後。任何想法我可以做到這一點？ – egr103

如果您使用position:fixed和position : absolute，您可以創建內容通過圖像背景之上的效果。在捕獲滾動事件時，有一些jQuery效果來管理文本的。

<body> 
    <div id="top"> 
    </div> 
    <div id="content"> 
    </div> 
</body>

CSS

#top{ 
    position:fixed; 
    height : 200px; 
    width : 100%; 
    background-image:url("http://www.falve.co.nz/site/uploads/2012/09/1500x900-collection-page-image.jpg"); 
    background-size:cover; 
    z-index:1; 
} 

#content{ 
    position:absolute; 
    height : 2000px; 
    margin-top:200px; 
    width : 100%; 
    background-color:#F99; 
    z-index:2; 
}

您對http://jsfiddle.net/UVWdg/

來源

2013-09-24 17:57:02

你能分享任何類型的代碼示例讓我開始？我更願意使用jQuery – egr103

試試這個插件：http://johnpolacek.github.io/scrolldeck.js/decks/parallax/ –

我已經添加了一個例子來開始開發。 –

這個例子被稱爲parallax effect並通過JavaScript來實現的。

以下是您可以用於自己的項目的few resources。

來源

2013-09-24 17:57:37 gillytech

回答

相關問題