Firefox有時不會在畫布中加載圖像

Question

我在this pen中有一個畫布元素。有時當我在Firefox中查看它時，一切都沒問題，但有些時候它不會加載圖像。什麼可能是錯的？ Chrome運行良好。

爲了使用它：

var txt = new txtImg (/*params*/) 

Answer 1

你試圖使用你的形象是完全加載之前。

瀏覽器將開始加載您的圖像（在img.src上），並立即繼續下一個代碼，同時加載圖像。

使用img.onload回調來等待圖像完全加載。

var txt; 
var img = document.createElement ('img'); 
img.onload=function(){ 
    txt = new txtImg (img, "ABCDEF...long text shortened", 10); 
    document.body.style.background = "rgb(132, 162, 255)"; 
} 
img.src = "data:image/jpeg;base64,...long text shortened";