jQuery를 UI의 API - .addClass ()
범주
특수 효과 (효과) | 효과 코어 (코어 효과) | 메소드 오버로딩 (방법 오버라이드 (override))
용법
설명 : 애니메이션 스타일을 추가 지정된 클래스 내에서 일치하는 요소의 집합의 각 요소에 대해 변경합니다.
반환 값 : JQuery와
.addClass( className [, duration ] [, easing ] [, complete ] )
参数 | 类型 | 描述 | 默认值 |
---|---|---|---|
className | String | 要添加到每个匹配的元素的 class 属性中的一个或多个 class 名称,多个 class 名称用空格分隔。 | |
duration | Number 或 String | 一个字符串或一个数字,指定动画将运行多久。 | 400 |
easing | String | 一个字符串,指示要使用的 easing 函数。 | swing |
complete | Function() | 一旦动画完成时要调用的函数。 |
.addClass( className [, options ] )
参数 | 类型 | 描述 |
---|---|---|
className | String | 要添加到每个匹配的元素的 class 属性中的一个或多个 class 名称,多个 class 名称用空格分隔。 |
options | Object | 所有的动画设置。所有的属性是可选的。
|
스타일 변화의 모든 세부 사항은 자바 스크립트를 사용하지 않고 CSS를 통해 수행되는 것을 보장하면서 기본 CSS와 유사한, jQuery를 UI의 애니메이션 클래스는, 변화의 하나의 상태로부터 다른 상태로의 원활한 전환을 제공합니다 전환. 모든 클래스 애니메이션, 포함 .addClass()
, 사용자 지정 애니메이션의 기간과 수 있습니다 완화 애니메이션도 완료 콜백을 제공, 기능.
모든 스타일이 추가 애니메이션 할 수 없습니다. 예를 들어, 배경 이미지 애니메이션. 되지 않은 애니메이션 스타일 애니메이션의 끝에서 변경됩니다.
jQuery를에서 플러그인 확장 내장 .addClass () 메소드를. jQuery를 UI가로드되지 않은 경우, 전화 .addClass()
메소드가 jQuery를에 존재하기 때문에, 단순히 실패하지 않는 방법을. 그러나 예상 된 동작하지 않습니다.
예
일치하는 요소에 클래스 "큰 블루"를 추가합니다.
<! DOCTYPE html로> <HTML LANG = "EN"> <헤드> <메타 문자 집합 = "UTF-8"> <제목> .addClass () 데모 </ 제목> <링크 REL = "스타일 시트"HREF = "// code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css"> <스타일> 사업부 { 폭 : 100 픽셀; 높이 : 100 픽셀; 배경 색상 : #ccc; } .big 블루 { 폭 : 200 픽셀; 높이 : 200 픽셀; 배경 색상 : # 00F; } </ 스타일> <스크립트 SRC = "// code.jquery.com/jquery-1.10.2.js"> </ script> <스크립트 SRC = "// code.jquery.com/ui/1.10.4/jquery-ui.js"> </ script> </ 헤드> <바디> <DIV> </ DIV> <스크립트> $ ( "사업부") .click (함수 () { $ (이) .addClass ( "큰 블루", 1000, "easeOutBounce"); }); </ 스크립트> </ BODY> </ HTML>