如何在后台加載圖像？

Question

問題：我正在創建一張專輯。所以每次按

時間“NEXT”按鈕我正在加載新圖像。 我想要實現的是，只有從服務器完全下載新圖像后，我才想從舊圖像切換到新圖像。

實際上我不想在加載時顯示部分圖像。
有什么解決辦法嗎？

PS 類似的問題，但這是針對Iphone的。 我需要瀏覽器嗎？

Answer 1

只需通過 javascript 創建一個新圖像，並且僅在onload觸發后顯示圖像。 這將確保您看不到圖像的任何部分渲染。

現場演示

    var curImg = new Image();

    curImg.src = "url to your image";
    curImg.onload = function(){
        // do whatever here, add it to the background, append the image ect.
        imgHolder.appendChild(curImg);   
    }

Answer 2

鏈接 rel="prerender" 可能會成功。

http://www.catswhocode.com/blog/mastering-html5-prefetching

Answer 3

您可以使用 2 個 img 標簽。 img1 顯示第一張圖像，而 img2 被隱藏，並加載下一張圖像。

在img2的onload事件中，可以隱藏img1，顯示img2。

並使用 img1 加載下一個圖像，依此類推。