Chrome背景圖片在刷新時留下白色空間

我目前正在構建一個網站，並且在Chrome中顯示它時遇到了一些麻煩。Chrome背景圖片在刷新時留下白色空間

當站點完全加載時，您滾動到某個點並點擊刷新按鈕。背景圖片上方會出現白色方塊，看起來背景圖片沒有完全加載。

我試圖重現這個錯誤，它有同樣的問題。該問題只與谷歌Chrome的出現

這是我的源代碼，轉載網站：

<html> 
    <head> 
     <style> 
      body { 
       background-image: url(http://www.wallpaperawesome.com/wallpapers-awesome/wallpapers-royalty-free-photos-images-for-commecial-use-awesome/wallpaper-royalty-free-photo-image-awesome-277.jpg) !important ; 
       background-repeat:no-repeat; background-attachment:fixed; 
      } 
     </style> 
    </head> 
    <body> 

-- Just pasted some long text from wikipedia here -- 

    </body> 
</html>

我也發現了同樣的問題在網站上同時搜索的問題： http://css-tricks.com/examples/FullPageBackgroundImage/progressive.php

時你滾動到底部並刷新，圖像不會100％顯示。當你開始滾動時，它立即加載完全。

編輯：缺少重要的事實：看起來這個錯誤只發生在網站上有一個滾動條，並且你不在其頂部刷新。

來源

2014-09-26 DarthVader

據我所知，這個問題已經從Google修復。

來源

2016-06-14 13:46:17 Hagen

試試這個：

<style> 
     body { 
      background: url(http://www.wallpaperawesome.com/wallpapers-awesome/wallpapers-royalty-free-photos-images-for-commecial-use-awesome/wallpaper-royalty-free-photo-image-awesome-277.jpg) center no-repeat ; 
      background-size: cover; 
      -webkit-background-size: cover; //safari chrome 
      -moz-background-size: cover; // firefox 
      -o-background-size: cover; 
     } 
</style>

來源

2014-09-26 08:12:12 Topr

感謝您的幫助。它似乎背景附件：固定;是問題。由於我的網站的高度非常大，因此css封面會使圖片太大。插入附件時：固定問題回來 – DarthVader 2014-09-26 08:26:05

這似乎是關係到瀏覽器，而不是你的代碼中的問題。但是一種解決方法是使用腳本再次加載背景。

<script type="text/javascript"> 
function loadBg() { 
     document.body.style.backgroundImage="url('backgroundImage.jpg')"; 
    } 
</script> 

<body onload="loadBg()">

雖然我不會太在意這個錯誤。

來源

2014-09-26 08:24:05 Edwin

Chrome背景圖片在刷新時留下白色空間

回答

相關問題