這可能是實現高斯模糊（毛玻璃）最簡單的庫了

高斯模糊(毛玻璃效果)實現方式

源碼，歡迎star哦

1：css

2：canvas StackBlur.js 借用

3：svg

本文選用方式 優勢：比canvas庫小，庫源碼算法較難懂；實現比 css 樣式效果更好，之前遇到過該類需求filter大後 css邊會變的模糊，效果較差

解決方案

文檔註釋

標籤的 id 屬性可為濾鏡定義一個唯一的名稱（同一濾鏡可被文檔中的多個元素使用）

filter:url 屬性用來把元素鏈接到濾鏡。當鏈接濾鏡 id 時，必須使用 # 字符

濾鏡效果是通過 標籤進行定義的。fe 後綴可用於所有的濾鏡

標籤的 stdDeviation 屬性可定義模糊的程度

in="SourceGraphic" 這個部分定義了由整個圖像創建效果

step2:使用

實例提供setBlurAmount，generateBlurredImage兩個接口動態設置

鏈接：https://juejin.im/post/5abb6110f265da23945f8a30

閱讀更多 前端圈 的文章

關鍵字: 技術 模糊 屬性