원문 링크 http://api.jquery.com/jQuery.fx.interval/
개요 : 에니메이션 프레임 조절(밀리세컨드 기준).
- jQuery.fx.interval
이 속성은 애니메이션이 실행되는 초당 프레임의 개수를 조정하는 것을 조절할 수 있습니다. 기본값은 13 밀리세컨드 즉, 0.013초 입니다. 값을 낮게 잡으면 크롬과 같은 브라우져에서는 에니메이션이 부드럽게 작동하지만, CPU 점유율이 올라가는 단점이 있습니다.
jQuery 는 하나의 전역 인터벌(global interval)을 사용하기 때문에, 애니메이션을 멈추려면 이 속성값을 변경해야 합니다.
Note:jQuery.fx.interval
는 현재 Google Chrome 11 버젼과 같은 requestAnimationFrame
속성을 지원하는 브라우저에서는 작동하지 않습니다. 이 문제는 이후 릴리스에서 변경될 수 있습니다.
제가 사용하는 크롬 버젼은 18이네요. ㅎㅎ;; 욕은 아닙니다.
예 제
모든 에니메이션을 적은 프레임으로 세팅하여 실행합니다.
<!DOCTYPE html> <html> <head> <style> div { width:50px; height:30px; margin:5px; float:left; background:green; } </style> <script src="http://code.jquery.com/jquery-latest.js"></script> </head> <body> <p><input type="button" value="Run"/></p> <div></div> <script> jQuery.fx.interval = 1000; $("input").click(function(){ $("div").toggle( 3000 ); }); </script> </body> </html>
미리보기
뚝뚝 끊어지는 거 보이시죠? 사실 interval 값이 100으로 되어 있었는데 제가 1000으로 수정했습니다. 효과가 더 잘보이라구요. 참고하세요.
알아서 나쁠건 없습니다. 까먹어도 되긴 하지만요. ㅎㅎㅎ
그럼 즐프하세요.
※ 본 예제는 http://www.jquery.com 에 있는 내용임을 밝힙니다.
'프로그래밍 > jQuery' 카테고리의 다른 글
show(), 요소 보이게 하기 (0) | 2012.04.25 |
---|---|
queue(), 대기열의 함수와 대기열 조작하기 (0) | 2012.04.25 |
hide(), 요소 숨기기 (2) | 2012.04.19 |
jQuery.fx.off, 전체 애니메이션 효과 전역 설정 (0) | 2012.04.19 |
fadeToggle(), 페이드 인/아웃 토글 (0) | 2012.04.16 |
fadeTo(), 투명도를 조절하기 (0) | 2012.04.16 |
fadeOut(), 서서히 사라지게 하기 (0) | 2012.04.16 |
fadeIn(), 서서히 나타나게 하기 (0) | 2012.04.16 |