>  기사  >  웹 프론트엔드  >  HTML5의 SVG 페이지에서 가우시안 블러를 사용하는 방법

HTML5의 SVG 페이지에서 가우시안 블러를 사용하는 방법

青灯夜游
青灯夜游앞으로
2018-10-09 16:50:032702검색

이 글은 주로 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=&#39;url(#blur-effect-2)&#39; //调用2级模糊量

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

요약: 위 내용이 이 글의 전체 내용입니다. , 모든 사람이 도움말을 배우는 데 도움이 되기를 바랍니다. 더 많은 관련 튜토리얼을 보려면 Html5 비디오 튜토리얼을 방문하세요!

관련 권장 사항:

php 공공 복지 교육 비디오 튜토리얼

HTML5 그래픽 튜토리얼

HTML5 온라인 매뉴얼

위 내용은 HTML5의 SVG 페이지에서 가우시안 블러를 사용하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
이 기사는 jb51.net에서 복제됩니다. 침해가 있는 경우 admin@php.cn으로 문의하시기 바랍니다. 삭제