HTML5のSVGページでガウスぼかしを使用する方法

この記事は、HTML5 が svg ページでどのようにガウスぼかしを使用するかに関する関連情報を主に紹介しています。必要な方は参考にしていただければ幸いです。

最初にこのコードをページの任意の領域に配置します

stdDeviation はブラーの量を設定します。最小値は 0

<svg style="display:none">
    <filter id="blur-effect-1">
        <feGaussianBlur stdDeviation="1"/>
    </filter>
    <filter id="blur-effect-2">
        <feGaussianBlur stdDeviation="2"/>
    </filter>
</svg>

dom でブラー効果を呼び出します

document.body.style.filter='url(#blur-effect-2)' //调用2级模糊量

document.body.removeAttribute("style");//关闭模糊效果

要約 : 以上がこの記事の全内容です。皆さんの学習に役立つことを願っています。関連チュートリアルの詳細については、Html5 ビデオ チュートリアルをご覧ください。

関連する推奨事項:

php 公共福祉トレーニング ビデオ チュートリアル

HTML5 グラフィック チュートリアル

HTML5オンライン マニュアル

以上がHTML5のSVGページでガウスぼかしを使用する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。