HTML圖像渲染通知

Question

在一個網頁中，我有一個大圖像加載和其他內容。有時圖像需要較長的時間才能加載，我想跟蹤它。當瀏覽器完全呈現圖像時，是否有任何方法可以使用Javascript進行通知？

編輯

我使用下面的代碼加載圖像。

<table border="0" style="background-image: url(http://abc.com/abc.jpg);" id="imageDisp"> 
</table> 

一些UPDATE
有沒有什麼簡單的方法來知道圖像花了多長時間來呈現？使用JavaScript我收到一個圖像現在加載的通知，有沒有辦法知道圖像加載何時開始？這樣可以計算經過的時間？

Answer 1

您可以在<img>元素的load事件上掛鉤。例如。

<img src="http://upload.wikimedia.org/wikipedia/commons/3/31/Atlantic_hurricane_tracks.jpg" 
    onload="alert('finished!');"> 

Jsfiddle demo。

---

更新：

然後創建new Image()代替（平均瀏覽器是足夠聰明，不要求相同的圖像兩次，多次引用將指向相同的圖像請求）：

<script> 
    var img = new Image(); 
    img.src = 'http://upload.wikimedia.org/wikipedia/commons/3/31/Atlantic_hurricane_tracks.jpg'; 
    img.onload = function() { 
     alert('finished!'); 
    } 
</script> 

Another jsfiddle demo（不要忘記清除瀏覽器緩存，相同的圖像可能已經緩存:)）。

最新問題

• 1.
• 2.
• 3.
• 4.
• 5.
• 6.
• 7.
• 8.
• 9.
• 10.

 相關問題

• 1.
• 2.
• 3.
• 4.
• 5.
• 6.
• 7.
• 8.
• 9.
• 10.