jQuery 효과 - animate() 메서드
예제
"div" 요소의 높이를 변경합니다：
$(".btn1").click(function(){
$("#box").animate({height:"300px"});
});
정의와 사용법
animate() 메서드는 CSS 속성 집합의 커스터마이zed 애니메이션을 실행합니다。
이 메서드는 CSS 스타일을 통해 요소의 하나의 상태에서 다른 상태로 변환합니다. CSS 속성 값은 점진적으로 변경되어 애니메이션 효과를 생성할 수 있습니다。
애니메이션을 생성할 수 있는 것은 숫자 값만입니다（예："margin:30px"）。문자 값은 애니메이션을 생성할 수 없습니다（예："background-color:red"）。
비고:"+=" 또는 "-="를 사용하여 상대적인 애니메이션（상대적인 애니메이션）을 생성합니다。
문법 1
$().animate(스타일,speed,easing,callback)
| 파라미터 | 설명 |
|---|---|
| 스타일 |
필수입니다. 애니메이션 효과를 생성하는 CSS 스타일과 값을 정의합니다。 가능한 CSS 스타일 값（예제를 제공합니다）：
비고:CSS 스타일은 DOM 이름(예 "fontSize")로 설정되며, CSS 이름(예 "font-size")로 설정되지 않습니다. |
| speed |
선택 사항. 애니메이션의 속도를 정의합니다. 기본적으로 "normal"입니다 가능한 값:
|
| easing |
선택 사항. 다른 애니메이션 포인트에서 애니메이션 속도를 설정하는 easing 함수를 정의합니다 내장된 easing 함수:
확장 플러그인에서 더 많은 easing 함수를 제공합니다. |
| callback |
선택 사항. animate 함수가 실행된 후에 실행되는 함수. 콜백에 대해 더 많이 배우고 싶다면, 우리의 jQuery 콜백 이 장. |
문법 2
$().animate(스타일,options)
| 파라미터 | 설명 |
|---|---|
| 스타일 | 필수. 애니메이션 효과를 생성하는 CSS 스타일과 값(위와 같습니다). |
| options |
선택 사항. 애니메이션의 추가 옵션을 정의합니다 가능한 값:
|
