第7回 エフェクト編連載:jQuery逆引きリファレンス(19/19 ページ)

» 2010年05月21日 00時00分 公開
前のページへ 1|2|3|4|5|6|7|8|9|10|11|12|13|14|15|16|17|18|19       



「連載:jQuery逆引きリファレンス」のインデックス

連載目次


 低スペックのクライアントでスクリプトを動作させている、あるいは、そもそもアニメーションによってアクセシビリティ上の問題が発生しているなどの理由で、アニメーション機能を無効化したいというケースもあるでしょう。そのような場合には、「$.fx.offプロパティ」をtrueに設定することで、以降のすべてのアニメーション処理を無効化できます。

 例えば、以下の例ではスライドダウン効果をアイコン画像に付与していますが、$.fx.offプロパティをtrue(アニメーションを無効)にしているために、スライドダウンはせずに、そのままアイコン画像が表示状態になります。

<script type="text/javascript">

$(function() {

  $.fx.off = false;

  $('div').slideDown(5000, function() {
    window.alert('表示されました。');
  });
});

</script>

  ……中略……

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

リスト121 アニメーション機能をオフにする(Off.html)
このHTMLを実際にブラウザで開く


ブラウザで開く

リスト121の実行結果
▲アニメーションせずにそのままアイコン画像を表示

 $.fx.offプロパティをfalseにするか、$.fx.offプロパティ自体をコメントアウトすると、スライドダウンが正しく動作することも確認してみましょう。

「連載:jQuery逆引きリファレンス」のインデックス

連載:jQuery逆引きリファレンス

前のページへ 1|2|3|4|5|6|7|8|9|10|11|12|13|14|15|16|17|18|19       

Copyright© Digital Advantage Corp. All Rights Reserved.

RSSについて

アイティメディアIDについて

メールマガジン登録

@ITのメールマガジンは、 もちろん、すべて無料です。ぜひメールマガジンをご購読ください。