본문 바로가기
Develops/Javascript & jQuery

[JQUERY] 눈 내리는 효과(Snowfall) 적용하기

by SLOTH91 2024. 3. 3.
반응형
  • 해당 글은 github에 있는 Snowfall이라는 jQuery 기반 플러그인을 활용하였습니다.

 

 

추가해야 할 파일

 - jquery.js
 - snowfall.jquery.js
 - snowfall.js

 

소스 코드

    <!-- javascript 선언 -->
    <script tyle="text/javascript" src="js/jquery.js"></script>
    <script tyle="text/javascript" src="js/snowfall.jquery.js"></script>
    <script tyle="text/javascript" src="js/snowfall.js"></script> 

    <script tyle="text/javascript">
        <!-- 페이지 호출 시 실행 -->
        $(document).ready(function(){
            $(document).snowfall({
                image :"img/flake.png", 
                minSize: 3, 
                maxSize:10, 
                flakeCount : 120
            });
        });
    </script>
  • 페이지 상단 해당 스크립트를 선언하게 되면, 페이지에 효과가 적용됩니다.
  • image, minSize, maxSize, flakeCount 등 그 외 옵션들을 통해 이벤트 조작이 가능합니다. 그 외 옵션들의 경우는 https://github.com/loktar00/JQuery-Snowfall에서 참고하시길 바랍니다.
반응형