svg模糊過濾器不工作在Firefox中

我想使用模糊svg過濾器作爲外部文件，並通過CSS屬性鏈接它。svg模糊過濾器不工作在Firefox中

我可以用colorMatrix過濾器成功地做到這一點，但是當我將其更改爲GaussianBlur時，圖像消失。

的HTML和CSS很容易

<div class="demo"> 
    <img src="./frost_files/demo.jpg"></img> 
</div> 

.demo { 
    filter: url(blur.svg#blur); 
}

和文件blur.svg包含：

<svg version="1.1" height="0" xmlns="http://www.w3.org/2000/svg"> 
    <filter id="blur"> 
     <feGaussianBlur stdDeviation="1"/> 
    <filter> 
</svg>

，做工作SVG文件包含：

<svg version="1.1" xmlns="http://www.w3.org/2000/svg"> 
<filter id="grey"> 
<feColorMatrix type="matrix" values="0.3333 0.3333 0.3333 0 0 
0.3333 0.3333 0.3333 0 0 
0.3333 0.3333 0.3333 0 0 
0 0 0 1 0"/> 
</filter> 
</svg>

我有看到這個答案：filter:blur for mozilla firefox not working （這就是爲什麼我加了height =「0」）。我嘗試了所有可能的名稱空間組合，svg：svg：svg：filter，svg：feGaussianBur等，但沒有解決問題。

來源

2013-06-18 vals

您已將XML過濾器關閉標記</filter>編寫爲<filter>即另一個打開。所有你需要的是倒數第一行上的一個字符變化...

<svg version="1.1" xmlns="http://www.w3.org/2000/svg"> 
    <filter id="blur"> 
     <feGaussianBlur stdDeviation="1"/> 
    </filter> 
</svg>

來源

2013-06-18 19:22:41

傻我...我已經刪除它編輯從 ..謝謝！ – vals

，這是否正確？ .demo { filter：url（blur.svg＃blur）; } –

@GCyrillus這是因爲這是一個名爲blur.svg的外部文件。 Whitout說，它是內聯的。 – vals

你有兩個錯誤：

的URL過濾
名稱空間濾波器

http://codepen.io/gcyrillus/pen/vnlEL

<svg xmlns="http://www.w3.org/2000/svg"> 
<filter id="blur1"> 
     <feGaussianBlur stdDeviation="3"/> 
    </filter> 
</svg>

.demo{ 
    filter: url('#blur1'); 
    float:left; 
} 

.demo2{ 
    filter: url('#grey'); 
}

前

來源

2013-06-18 18:58:48

svg模糊過濾器不工作在Firefox中

回答

相關問題