Question

我有一个画布，感谢谷歌在IE中的excanvas。现在我想模糊这件事。我添加了一个带有IE属性语法的模糊过滤器，它模糊了画布和div中的文本。

嗯......它在IE7和IE9中工作，但在IE8中不。 [WTF？！]

希望有人以前见过这个。

我还试图在画布上绘制后从javascript启用模糊，但它没有改变任何东西。

这是一个实例：

http://jsfiddle.net/rd9q5/1/embedded/result/

该示例仅是IE代码。它不适用于其他浏览器，但我的主要代码是。

我在示例中添加了一个有趣的图像，让您在帮助我时感到愉快。：）

[编辑]

通常模糊在IE8中起作用 - 我在示例页面的div底部放了一些文本，文字变得模糊。

Answer 1

这是因为在g_vml_上指定的'position：absolute'：由excanvas.js第597行生成的形状

为什么？！......

因为在IE8中有一个BUG，除静态之外的位置的元素不会继承父元素的过滤器，除非我们这样做。

要解决此问题，请执行以下选项之一

function go() {
    var browser = navigator.userAgent.toLowerCase().match(/(msie) ([\w.]+)/);
    if(document.styleSheets['ex_canvas_'] && browser && browser[2].slice(0,1) == '8'){
        var stylesheet = document.createStyleSheet();
        stylesheet.owningElement.id = 'ex_canvas_';
        stylesheet.cssText = '#cp *{filter:inherit;}';
    }
    // codes for draw
}

或者

<!--[if IE 8]>
    <style type="text/css">
         #cp *{
             filter:inherit;
         }
    </style>
<![endif]-->

Answer 2

看看这篇文章。这是一个漫长的方式，但可能有所帮助。

http://aautar.digital-radiation.com/blog/?p=2519

更多：

Answer 3

因为微软在IE7之后抛弃了'过滤器'所以我很惊讶你说它在IE9中有效。

IE8模糊滤镜在画布上

3 个答案:

为什么？！......