jQuery의 slideUp 및 slideDown 메소드
slideUp 메소드와
slideDown 메소드는
요소를 "접기"와 "펼치기" 할 수 있게 해줍니다
(이 메소드들은 또한 효과 실행 시간을 매개변수로 받으며, 지정하지 않으면
기본값인 400ms가 사용됩니다). 이게
어떻게 보이는지 다음 예제를 통해 확인해 보세요.
두 개의 버튼과 div가 있다고 가정해 봅시다:
<button id="hide">hide</button>
<button id="show">show</button>
<div id="elem">text...</div>
CSS는 다음과 같습니다:
#elem {
padding: 10px;
width: 150px;
height: 150px;
border: 1px solid green;
margin-top: 10px;
}
이제 slideUp 메소드와
slideDown 메소드를 적용합니다:
$('#hide').click(function() {
$('#elem').slideUp(1000);
});
$('#show').click(function() {
$('#elem').slideDown(1000);
});
