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";