如何检查我的浏览器是否支持HTML5 Canvas混合模式？ [英] How to check if HTML5 Canvas blend modes are supported in my browser?

问题描述

如何以编程方式查找我的浏览器是否支持HTML5混合模式（ http ：//www.w3.org/TR/compositing-1/#mix-blend-mode ）？

How to programatically find if my browser supports HTML5 blend modes ( http://www.w3.org/TR/compositing-1/#mix-blend-mode) ?

我的代码结构如下

    var canvas = document.getElementById("Canvas");
    var context = canvas.getContext("2d");

    context.fillStyle = "#fff";
    context.fillRect(0, 0, canvas.width, canvas.height);

    context.globalCompositeOperation = "source-over"
    context.globalCompositeOperation = "soft-light";
    if (context.globalCompositeOperation){
      //browser supports
      alert('true');
    }
    else {
      // browser doesn't support
      alert('false');
    }

但它看似不正常。即使在IE中，它也会发出'true'警告。 （ http://caniuse.com/#search=blend 表示IE不支持混合模式）

But it doesn't seem to work correct. It alerts 'true' even in IE. (http://caniuse.com/#search=blend says blend mode is not supported in IE though)

推荐答案

你应该使用

context.globalCompositeOperation = blendMode;
if (context.globalCompositeOperation !== blendMode){
     // not supported mode
}

这篇关于如何检查我的浏览器是否支持HTML5 Canvas混合模式？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！