filter:模糊的mozilla firefox 无效
我正在开发一个页面,它将动画图像,淡入模糊风格。 它适用于谷歌Chrome,但在Mozilla Firefox中没有。
我为mozilla firefox尝试这种方法。 http://css-plus.com/2010/05/how-to-add-a-gaussian-blur-effect-to-elements-within-firefox/但图像不可见。
这是我的代码:
JS:
$(document).ready(function() { $("img").css({ "filter": "blur(4px)", "-webkit-filter": "blur(4px)", "-moz-filter": "blur(4px)", "-o-filter": "blur(4px)", "-ms-filter": "blur(4px)", "filter":"url('#blur1')" }); window.setTimeout(function() { $("img").css({ "filter": "blur(3px)", "-webkit-filter": "blur(3px)", "-moz-filter": "blur(3px)", "-o-filter": "blur(3px)", "-ms-filter": "blur(3px)", "filter":"url('#blur1')" }); }, 3000); window.setTimeout(function() { $("img").css({ "filter": "blur(2px)", "-webkit-filter": "blur(2px)", "-moz-filter": "blur(2px)", "-o-filter": "blur(2px)", "-ms-filter": "blur(2px)", "filter":"url('#blur1')" }); }, 3100); window.setTimeout(function() { $("img").css({ "filter": "blur(1.5px)", "-webkit-filter": "blur(1.5px)", "-moz-filter": "blur(1.5px)", "-o-filter": "blur(1.5px)", "-ms-filter": "blur(1.5px)", "filter":"url('#blur1')" }); }, 3200); window.setTimeout(function() { $("img").css({ "filter": "blur(1px)", "-webkit-filter": "blur(1px)", "-moz-filter": "blur(1px)", "-o-filter": "blur(1px)", "-ms-filter": "blur(1px)", "filter":"url('#blur1')" }); }, 3300); window.setTimeout(function() { $("img").css({ "filter": "", "-webkit-filter": "", "-moz-filter": "", "-o-filter": "", "-ms-filter": "", "filter":"url('#blur1')" }); }, 3400); $("#promoIMG").fadeIn(5000); });
HTML: