Firefox有时不会在画布中加载图像

Question

我在this pen中有一个canvas元素。有时当我在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";