jQuery 기본 강의

jQuery 효과

toggle() 메서드는hide()와show()메서드 간 전환

이 메서드는 선택된 요소의 보이기 여부를 확인합니다：

주의：숨겨진 요소는 더 이상 페이지 레이아웃에 영향을 미치지 않습니다。

$(selector).toggle(duration, easing, callback)

버튼을 클릭할 때, 모든 <p> 요소의 hide와 show 사이에서 전환합니다：

예제

$("button").click(function(){
　　$("p").toggle();
});

사용duration파라미터：

예제

$("button").click(function(){
　　$("p").toggle();1500);
});

사용콜백파라미터：

예제

$("button").click(function(){
　　$("div").toggle();1500, function(){
　　　　alert("toggle() 효과 완료!!!");
　　});
});

모든 범위(예: 단어)에 애니메이션을 제작하여 빠르게 숨기기/표시하고,200밀리초 내에 각 애니메이션을 완료합니다：

예제

$("button").click(function(){
　　$("span:first-child").toggle("fast",　function(){
　　　　$(this).next().toggle("fast",　arguments.callee);
　　});
});

파라미터	설명
duration	가능한 값: 숨기는 것을 결정/표시 효과가 얼마나 오래 실행될지. 기본 값은400밀리초 가능한 값: 밀리초(예100、500、2000 등) “fast” “slow”
easing	가능한 값: (선택) 애니메이션의 다른 시점에서 요소의 속도를 지정하는 문자열. 기본 값은 “swing” 가능한 값: “swing”-시작할 때/끝나면 더 느리게 이동하고, 중간에 더 빠르게 이동 “linear”-빠른 속도로 이동
콜백	toggle() 메서드가 완료된 후 호출되는 함수, 각 선택된 요소에 대해 한 번 호출됨