第7回 エフェクト編：連載：jQuery逆引きリファレンス（3/19 ページ）

jQueryの大きな特徴の1つは簡単なコードで実現可能なさまざまなアニメーションだ。アニメーション用メソッドをまとめた、すぐに役立つ18本を一挙公開。

[山田祥寛（http://www.wings.msn.to/），著]

連載目次

　hideメソッドは、表示状態の要素を非表示状態にします。引数speedには、非表示になるまでの時間（ミリ秒）、もしくはあらかじめ決められた値として、slow、normal、fastのいずれかを指定します。引数fncは、要素が表示状態になったときに実行するコールバック関数を表します。

　具体的な例も見てみましょう。以下は、ページ・ロード時にアイコン画像を5秒（＝5000ミリ秒）かけて非表示にするサンプルです。

<script type="text/javascript">

$(function() {

  // <div>要素の内容をゆっくり非表示状態に
  $('div').hide('slow', function() {
    // 非表示になったらダイアログを表示
    window.alert('非表示状態です。');
  });
});

</script>

  ……中略……

<div>
  <img src="http://www.wings.msn.to/books/978-4-7981-1957-1/978-4-7981-1957-1_logo.jpg" alt="ASP.NET" />
</div>

リスト105 表示状態のアイコン画像をゆっくりと表示状態に（Hide.html）
このHTMLを実際にブラウザで開く

ブラウザで開く

5秒後

リスト105の実行結果

　引数speedが省略された場合、showメソッドはアニメーション効果を適用することなく、すぐに対象の要素を非表示状態にします。