IE9中的CSS3框阴影模糊

Question

有没有人注意到IE9的CSS标准阴影的"标准"实现与其他浏览器不同？每当我使用box-shadow并设置模糊值时,IE9似乎渲染模糊的值大约是Firefox,Safari,Chrome和Opera的一半.

有没有办法解决？如果它在所有其他浏览器中看起来与box-shadow看起来不一样,那么IE9支持box-shadow作为标准属性究竟是什么意思呢？

(从技术上讲,Safari 5仍然只支持-webkit-box-shadow而不是标准的box-shadow属性,但它也恰好与Firefox 4,Chrome 11和Opera 11中的box-shadow渲染相同.IE9是奇怪的人out,尽管支持相同的标准box-shadow语法).

Answer 1

我也遇到了这个问题，并用这个脚本（使用 jQuery）自己解决了它。

请注意，这是实验性的，我尚未测试性能。另外：如果你向有 box-shadow 的 dom 添加元素，你必须再次运行它。我想这可以使用 htc 文件来解决。

$(function(){
    fixBoxShadowBlur($('*'));
});

function fixBoxShadowBlur(jQueryObject){
    if($.browser.msie && $.browser.version.substr(0, 1) == '9'){
        jQueryObject.each(function(){
            boxShadow = $(this).css('boxShadow');
            if(boxShadow != 'none'){
                var bsArr = boxShadow.split(' ');
                bsBlur = parseInt(bsArr[2]) || 0;
                bsBlurMeasureType = bsArr[2].substr(("" + bsBlur).length);
                bsArr[2] = (bsBlur * 2) + bsBlurMeasureType;
                $(this).css('boxShadow', bsArr.join(' '));
            }
        });
    }
}