본문 바로가기

프로그래밍&IT/Javascript & jQuery

[JQuery] 효과 / 효과 제어 메서드

 

효과 메서드의 종류

종류 설명
hide() 노출되어 있는 요소를 숨긴다
show() 숨겨져있던 요소를 보여준다.
toggle() 숨겨져있던 요소는 보여지고, 노출되어 있던 요소는 숨긴다.
fadeIn() 숨겨져있던 요소가 점점 선명해지면서 보여진다
fadeOut() 노출되어 있던 요소가 점점 투명해지면서 숨겨진다.
fadeToggle() 노출되어 있던 요소는 점점 투명해지며 사라지고,
사라져 있던 요소는 선명해지면서 보여진다.
fadeTo() 노출되어 있던 요소에 투명도를 지정한 만큼 숨긴다
slideDown() 숨겨져 있던 요소가 밑으로 펼쳐지며 보여진다.
slideUp() 숨겨져 있던 요소를 위로 접으며 숨긴다.
slideToggle() 숨겨져 있던 요소는아래로 펼쳐지며 보여지고,
보여지고 있던 요소는 위로 접으면서 숨겨진다.
animate() 선택한 요소에 애니메이션을 적용한다.

$("요소").메서드명 ("효과 속도", 콜백함수)

효과속도 : [ 1/1000초 , fast , normal , show ]

 

효과 제어 메서드

효과나 애니메이션이 적용된 요소에 동작을 정지시키거나

동작 초기 실행을 지연시키는 등의 제어를 할 수 있는 메서드들을 의미.

종류 설명
stop() 현재 실행 중인 효과를 모두 정지
delay() 대기 중인 애니메이션 효과를 지정한시간만큼 지연된 후 발생
queue() 선택된 요소의 스택에 대기 중인 큐를 반환하거나 함수에 실행문을 큐로 추가시킬 수 있다
clearQueue() 첫 번째 큐에 해당하는 효과 또는 애니메이션만 실행하고 대기 중인 큐를 모두 삭제
dequeue() 스택에 쌓인 큐를 모두 제거
finish() 선택한 요소의 진행 중인 애니메이션이 강제로 완료 시점으로 간 후 종료