Canvas 图片未出现在 IE10 及以下版本中
Canvas image not appearing in IE10 and below
不知道我做错了什么,但显然我以某种方式扰乱了 IE10。我有一些看起来很简单的 FabricJS。它适用于除 IE10 及以下版本以外的所有内容。不知道为什么?
var canvas = new fabric.Canvas('imageCanvas', {
backgroundColor: 'rgb(240,240,240)'
});
var imgElement = document.getElementById('imageSource');
var fabricImg = new fabric.Image(
imgElement, {
selectable: false,
evented: false,
hasControls: false,
hasBorders: false
}
);
canvas.add(fabricImg);
显示 IE10(左)和 IE11(右)的屏幕截图:
Demo(https://jsfiddle.net/8fy3rv04/
我调整了我能想到的每个选项,并查看了 FabricJS documentation 中的 fabric.Image
,但我看不出我可能在哪里做了一些激怒 IE 的事情。现在拔头发!
答案是 CSS 的一个简单位,将 imageSource
标记为 display:none
。在隐藏的 <img>
元素中加载图像然后将其放在 canvas 上很有用,但我不得不通过 fabric.Image.fromURL
.
加载图像
IE10 的一个非常奇怪的问题,这意味着 <img>
被隐藏了,当它被放在 canvas 上时图像也被隐藏了!奇怪。
不知道我做错了什么,但显然我以某种方式扰乱了 IE10。我有一些看起来很简单的 FabricJS。它适用于除 IE10 及以下版本以外的所有内容。不知道为什么?
var canvas = new fabric.Canvas('imageCanvas', {
backgroundColor: 'rgb(240,240,240)'
});
var imgElement = document.getElementById('imageSource');
var fabricImg = new fabric.Image(
imgElement, {
selectable: false,
evented: false,
hasControls: false,
hasBorders: false
}
);
canvas.add(fabricImg);
显示 IE10(左)和 IE11(右)的屏幕截图:
Demo(
我调整了我能想到的每个选项,并查看了 FabricJS documentation 中的 fabric.Image
,但我看不出我可能在哪里做了一些激怒 IE 的事情。现在拔头发!
答案是 CSS 的一个简单位,将 imageSource
标记为 display:none
。在隐藏的 <img>
元素中加载图像然后将其放在 canvas 上很有用,但我不得不通过 fabric.Image.fromURL
.
IE10 的一个非常奇怪的问题,这意味着 <img>
被隐藏了,当它被放在 canvas 上时图像也被隐藏了!奇怪。