Div在給定固定位置時消失

我目前在www.thejasonsanders.com的網站上工作，每當我嘗試在除第一個（「主頁」）之外的任何部分給出div一個固定位置時，div消失。我嘗試了所有我能想到的方法來糾正這個問題，似乎沒有任何東西可以解決問題。所以，我正在轉向可能是我在這些類型的問題上的頭號資源！Div在給定固定位置時消失

我目前在divs「Portdiv」和Portdiv2下的「Portfolio」部分測試了一個圖像，主圖像的樣式與主div圖像相同。主logo圖像位於主頁部分，顯示正確，再次，它只是當一個圖像被放置在其他部分的其中一個部分開始行事怪異的時候，任何人都可以請幫我弄清楚發生了什麼事情？

謝謝你的時間和幫助！

來源

2013-08-01 user1721301

當一個div被賦予一個固定的位置並且它在視口之外基本上不存在，我認爲這就是你所面臨的問題Here's a quick demo。降低並且更短的<img> s消失。您可能想要使用position: absolute？對不起，如果我走了。

來源

2013-08-01 00:49:25

非常感謝您的快速反應，比爾！你的回答實際上是很有意義的，它讓我看到了我以錯誤的方式思考我的問題的事實。我感謝您花時間向我解釋這一點。祝你有個好的一天！ – user1721301

很高興能幫到你！ –

我有同樣的問題，它似乎是一個錯誤發生在頁面內部發生太多時，我可以通過將以下轉換代碼添加到固定位置元素來修復它（transform: translateZ(0);-webkit-transform: translateZ(0); ），強制瀏覽器使用硬件加速來訪問設備的圖形處理單元（GPU）以使像素飛行。另一方面，Web應用程序運行在瀏覽器的上下文中，這使得軟件可以執行大部分（如果不是全部）渲染，從而導致轉換的功率減少。但是網絡一直在追趕，大多數瀏覽器廠商現在都通過特定的CSS規則來提供圖形硬件加速。

使用-webkit-transform：translate3d（0,0,0）;將啓動GPU進行CSS轉換，使其更平滑（更高的FPS）。

注： translate3d（0,0,0）什麼也不做在你所看到的條款。它將對象在x，y和z軸上移動0px。這只是一種強制硬件加速的技術。

#fixed-element { 
    position: fixed; 
    /* MAGIC HAPPENS HERE */ 
    transform: translateZ(0); 
    -moz-transform: translatez(0); 
    -ms-transform: translatez(0); 
    -o-transform: translatez(0); 
    -webkit-transform: translateZ(0); 
    -webkit-font-smoothing: antialiased; /* seems to do the same in Safari Family of Browsers*/ 
}

來源

2014-09-18 23:20:32 Neo

Div在給定固定位置時消失

回答

相關問題