오늘 소개해드리는 내용은 벚꽃 꽃잎이 떨어지며 날리는 스크립트 소스입니다.
따뜻한 봄이 오고 여기저기서 벚꽃 축제가 한창이라 우리 홈페이지나 웹페이지에도 벚꽃잎이 날리게 바꿔보고 싶으신 분들이 많을거라 생각헤요.
일전에 소개해드렸던 눈 내리는 소스가 궁금하신 분은 아래 링크에서 확인해보시기 바래요.
실제로 네이버 웨일 브라우져에도 벚꽃 꽃잎이 날리고 있더라구요.
현재 제 티스토리 블로그에도 적용시켜놔서 이글을 보고 있는 순간에도 벚꽃잎이 날리고 있을거에요.
적용시키는 방법은 css 파일과 script 파일 추가하고 경로만 잡아주면 되니 그렇게 어렵지 않답니다.
head와 /head 사이에는 아래 첨부해드리는 css 소스 파일 경로를 넣어주면 되구요.
스크립트는 /body 위쪽에 js 소스 파일 경로를 잡아주시고 스크립트를 적용하시면 된답니다.
벚꽃 꽃잎 떨어지며 날리는 효과가 적용된 모습입니다.
See the Pen dmQRaX by kenshin (@parkgun) on CodePen.
벚꽃 꽃잎이 떨어지는 속도를 더 빠르게 하고 싶다면 js 파일에서 fallSpeed: 3 이부분을 찾아 숫자를 낮춰주면 더 빠르게 떨어집니다.
벚꽃 구경 못가고 이걸로 만족하고 있는게 웃프기도 하네요 ㅠ.ㅠ
도움 되셨길 바라며 이상으로 홈페이지나 웹페이지에 벚꽃 꽃잎 떨어지며 날리는 효과 html 소스에 대한 포스팅을 마칩니다.
메인 이미지 [출처] Free images by pngtree.com
'Smart' 카테고리의 다른 글
sick과 ill 두 영단어의 차이점은?? (0) | 2018.04.17 |
---|---|
영어 it의 쓰임! it는 언제 쓰는가? 다양한 활용법 (0) | 2018.04.14 |
스크롤시 문서 읽은 진행률을 알려주는 진행 프로그래스바 코드 소스 (1) | 2018.04.05 |
포토샵 사진 스케치(sketch) 효과 액션~ 진심 버튼만 눌러주면 끗~! (0) | 2018.03.30 |
뉴이스트w 공식 색상(색깔) 웹에서 css 그라데이션 적용 방법 (1) | 2018.03.25 |