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

I have a canvas element in this pen. Sometimes when I view it in Firefox, everything's alright, but other times, it doesn't load the image. What could be wrong? Chrome is working good.

我的笔中有一个画布元素。有时当我在Firefox中查看它时,一切都很好,但有时候,它不会加载图像。可能有什么不对? Chrome运行良好。

In order to use it:

为了使用它:

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

1 个解决方案

#1

You are trying to use your image before it's fully loaded.

您正在尝试在图像完全加载之前使用它。

The browser will start loading your image (on img.src) and immediately continue onto the next code while it simultaneously loads the image.

浏览器将开始加载您的图像(在img.src上)并立即继续下一个代码,同时加载图像。

Use the img.onload callback to wait for your image to fully load.

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

#1