(jQuery Plugin) CyclicFade 깜빡이는 효과 적용하기

준비물: (jQuery) 연결하기

비표준 <blink> 태그를 jQuery 플러그인으로 부드럽게 깜빡이는 효과를 줄 수 있다.

자바스크립트 연결하기<script type="text/javascript" src="http://www.bugzappy.com/demos/cyclic-fade/jquery/jquery.cyclic-fade.js"></script>
제작자 원문: http://www.bugzappy.com/cyclic-fade-jquery-plugin/


적용하기$(selector).cyclicFade();

$(selector).cyclicFade();
selector로 지정한 요소들에 .cyclicFade() 플러그인 메서드를 적용한다.

편리한 방법으로는 HTML을 작성할 때 적용을 원하는 요소에 class='cyclicfade' 처럼 임의의 클래스를 지정해주고
$('.cyclicfade').cyclicFade(); 처럼 사용하면 cyclicfade 클래스를 가진 모든 요소에 적용이 된다.


다양한 옵션을 줄 수 있다.$(selector).cyclicFade({ repeat: 0, params: [ {fadeout:100, stayout:300, opout:0, fadein:100, stayin:3000, opin:0.5}, {fadeout:100, stayout:300, opout:0, fadein:100, stayin:300, opin:0.75}, {fadeout:100, stayout:300, opout:0, fadein:100, stayin:300, opin:1.0} ] });

repeat: 숫자
반복 횟수를 지정하며 0이면 무한 반복한다.

params: 배열
파라미터를 1개 이상 지정할 수 있다.

{fadeout:100, stayout:300, opout:0, fadein:100, stayin:300, opin:1.0}
사라지는 속도, 대기 시간, 투명도, 보여지는 속도, 대기 시간, 투명도
속도는 밀리초를 입력하며, 투명도는 0 ~ 1까지의 실수를 입력한다.