帶有視差的頁面加載時的奇怪位置

我正在使用視差調整Wordpress主題來爲我爲事件開發的徽標。帶有視差的頁面加載時的奇怪位置

基本上我已經用新標識的不透明層替換了原始元素，然後將它們重新定位爲直接層疊在彼此之上。問題是，在我完成此操作後，頁面加載時徽標的放置或顯示與滾動事件註冊後的不同。

我對視差或javascript幾乎沒有經驗。該網站是在http://www.foodprint.se我收到的控制檯錯誤是鉻：

body.scrollTop在嚴格模式下不推薦使用。如果處於嚴格模式，請使用 'documentElement.scrollTop'，如果處於怪癖模式，請使用'body.scrollTop' 。 jquery.js：4 body.scrollLeft在嚴格模式下已棄用。如果在嚴格模式和'body.scrollLeft'中，請僅在特殊模式下使用'documentElement.scrollLeft'。 jquery.js：4 Object {type：「refresh」，state：Object} state：Object type：「refresh」 proto：Object script.js：192 event.returnValue已棄用。請改用標準的event.preventDefault（）。的jquery.js：3 對象{類型：「刷新」，狀態：對象}狀態：對象類型：「刷新」原：對象

我希望這可以給我在正確的任何提示方向。

來源

2013-12-19 bubbaJackson

您面臨的問題是chrome的一般問題.....它使用body.scrollTop來表示標準模式下的視口的滾動位置。

我想到的可能的原因是，chrome的製作者希望開發人員切換到更正式或通用的編碼風格....至於其他瀏覽器，如Mozilla，我不認爲你的問題會在那裏（有你在其他瀏覽器也檢查！？看我的mozilla :)罰款）

您可以修復退房this Git是否有幫助！

而且，如果它的好使用jquery， see this link，它顯示的body.scrollTop

編輯

相當於在您的文件layout.css中

你已經設置margin: 700px 0 0 0;對於#header .....這導致頁面僅在滾動後才渲染放置...更改700px0px

現在，內容將下降後，ammend在同一個文件#header .content部分下面：

#header .content { 
    margin: 700px 0 20px 0; /* previously it was 0 0 20px 0 */ 
    line-height: 18px; 
    z-index: 4; 
}

來源

2013-12-19 13:19:49 NoobEditor

感謝Mayank，但我發現在Safari或Firefox相同的行爲。我聽說它已在最新版本的Chrome中修復，但我仍然遇到問題。徽標最初出現在窗口的底部，然後滾動跳轉到頂部。不過謝謝，我會看看那個Jquery，雖然老實說我不太確定在哪裏實現它。 – bubbaJackson

by logo您的意思是'印度無限'上方頁面中間的'三色'圖像混合？ – NoobEditor

是啊，確切地說，下降的東西 – bubbaJackson

帶有視差的頁面加載時的奇怪位置

回答

相關問題