如何在Firefox中的画布上绘制透明PNG?

时间:2012-03-06 22:24:04

标签: javascript canvas rendering transparency

我一直在设置一个小框架,用于将可定位和动画图形渲染到<canvas>元素上 - 主要是为了帮助我理解它。

我从互联网上下载了一个随机精灵表进行测试 - 它有一个透明的背景,似乎在Chrome,我的iPhone和Safari上渲染得很好。

这是演示:http://martywallace.com/simplecanvas/

在Firefox中,精灵的透明部分加载为白色,最终看起来像这样:

enter image description here

是否有特定于Firefox的方式来启用透明度,还是不支持?

1 个答案:

答案 0 :(得分:2)

以下是[stupidity disclaimer]发生的事情:

  1. 我下载了最初的透明图片,并在Chrome,Safari和iPhone中进行了测试。
  2. 图像为1MB,因此我将其缩小为PNG8(导出时忘了允许透明度)。
  3. 图片的缓存版本用于我测试过的浏览器中(我没有注意到)。
  4. 当我转移到Firefox时,正在使用新的非透明(因为之前没有缓存)。
  5. 结果:Firefox渲染透明的PNG很好 - 很高兴这个问题被关闭为“过于本地化”。