jQuery 기본 강의

jQuery 효과

slideUp() 메서드는 슬라이드 방식으로 선택된 요소를 숨깁니다.

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

이 메서드는 일반적으로slideDown()메서드를 함께 사용합니다.

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

"#my-Div"을 숨기는 예제가 페이지에 표시됩니다:

예제

$("#my-Div").click(function(){
　　$(".panel").slideUp();
});

버튼을 클릭할 때, 모든 <p> 요소를 슬라이드업합니다:

예제

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

사용duration파라미터:

예제

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

사용콜백파라미터:

예제

$("button").click(function(){
　　$("div").slideUp(1500, function(){
　　　　alert("슬라이드업 완료!");
　　});
});

모든 " .panel"를 느리게 지속적인 시간과 선형缓动으로 슬라이드업하여

예제

$("#my-Div").click(function(){
　　$(".panel").slideUp("slow", "linear");
});

모든 범위(이 예제에서는 단어)를 빠르게 슬라이드하여200밀리초 내에 각 애니메이션을 완료합니다：

예제

$("button").click(function(){
　　$("span:last-child").slideUp("fast",　function(){
　　　　$(this).prev().slideUp("fast",　arguments.callee);
　　});
});

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