filtro: blur para mozilla firefox <svg> no funciona
Estoy desarrollando una página que animará la imagen, se desvanecerá con un estilo borroso. Funciona en google chrome pero en mozilla firefox no.
Intento este enfoque para el Mozilla Firefox.http://css-plus.com/2010/05/how-to-add-a-gaussian-blur-effect-to-elements-within-firefox/ Pero las imágenes no eran visibles.
este es mi codigo
js
<script type="text/javascript">
$(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);
});
</script>
html:
<div id="promoIMG">
<a href="main.php"><img src="images/akb1.png" alt="" onMouseOver="this.src='images/akb2a.png'" onMouseOut="this.src='images/akb1.png'"/></a><br/>
<img src="images/akb2.png" alt="AKB" />
</div>
</div>
<svg>
<filter id="blur1">
<svg:feGaussianBlur stdDeviation="1"/>
</filter>
</svg>
donde hice mal y cómo puedo hacerlo correcto para que la animación de la página de Mozilla Firefox sea igual en Chrome.
gracias por adelantado