스크롤시 fadeIn 하기 (jquery.fadein.js) 정보
스크롤시 fadeIn 하기 (jquery.fadein.js)
첨부파일
본문
요즘 스크롤 했을 때 fadeIn 해서 나오는 방식이 유행인 것 같더라구요.
새로 사이트를 개편하면서 넣고 싶어서 관련 라이브러리를 찾아봤는데,
검색 능력이 안 좋은 건지 못 찾겠어서 직접 만들었습니다.
사용법
1. jquery.fade-in.js, jquery.fade-in.min.js 중 아무거나 넣습니다.
<script src="jquery.fade-in.js"></script><script src="jquery.fade-in.min.js"></script>
2. 스크롤시 fadeIn 하기를 원하는 요소 class에 fade-in 을 넣습니다.
<div class="col-md-6 fade-in">fade-in을 원하는 div</div>
3. (선택) fadeIn 속도를 지정합니다. (이 과정을 생략한 경우 기본 500ms로 작동합니다.)
속도는 data-fade-in-speed 어트리뷰트를 통해 지정합니다.
<div class="col-md-6 fade-in" data-fade-in-speed="800">fade-in을 원하는 div</div>
궁금한 사항 댓글로 남겨주세요.
추천
7
7
댓글 12개
좋은정보 감사합니다.
유용한 기능이네요^^ 작업중인 사이트에 바로 적용해봤습니다. 감사합니다.
유익한 정보 감사합니다.
정말감사합니다.
좋은 정보 감사합니다
감사합니다
감사합니다
좋은 정보 감사합니다.
감사합니다
감사합니다
감사합니다
감사합니다!! ^-^