jQueryのUIの例 - クラスの追加（クラスの追加）
アニメーションスタイルが追加指定されたクラス内のマッチした要素の集合の各要素のために変更する場合。
詳細については.addClass()メソッドの詳細については、APIドキュメントを参照してください）（.addClassを 。
.addClass（）デモ
効果をプレビューするには、ボタンをクリックしてください。
<！DOCTYPE HTML>
<HTML LANG = "EN">
<ヘッド>
<メタ文字セット= "UTF-8">
<タイトル> jQueryのUIエフェクト - .addClass（）デモ</タイトル>
<リンクのrel = "スタイルシート"のhref = "// code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
<SCRIPT SRC = "// code.jquery.com/jquery-1.9.1.js"> </スクリプト>
<SCRIPT SRC = "// code.jquery.com/ui/1.10.4/jquery-ui.js"> </スクリプト>
<リンクのrel = "スタイルシート"のhref = "http://jqueryui.com/resources/demos/style.css">
<スタイル>
.toggler {幅：500pxなど;高さ：200pxの;位置：相対;}
#button {パディング：.5em 1EM;テキスト装飾：なし;}
#effect {幅：240ピクセル;パディング：1EM;フォントサイズ：1.2em;国境：1pxの固体＃000;背景：#eee;色：＃333;}
.newClass {テキストインデント：40ピクセル;文字間隔：.4em;幅：410px;高さ：100pxに;パディング：30px;マージン：10pxの;フォントサイズ：1.6em;}
</スタイル>
<スクリプト>
$（関数（）{
$（ "#button"）.click（関数（）{
$（ "#effect」）.addClass（「NewClass」、1000年、コールバック）;
falseを返します。
}）;
関数コールバック（）{
setTimeoutメソッド（関数（）{
$（ "#effect」）.removeClass（「NewClass"）;
}、1500）;
}
}）;
</スクリプト>
</ HEAD>
<ボディ>
<DIVクラス= "トグラー">
<DIV ID = "効果"クラス= "UI-コーナーすべて">
Etiamリベロneque、luctus、NEC、でゼンパー、Loremの。セッドのpedeをeleifend。
</ DIV>
</ DIV>
<a href="#" id="button" class="ui-state-default ui-corner-all">実行影響します</a>
</ BODY>
</ HTML>
