差分
このページの2つのバージョン間の差分を表示します。
| 次のリビジョン | 前のリビジョン | ||
| javascriptとsleep [2012/01/18 01:34] – 作成 hansendo | javascriptとsleep [2012/01/18 05:39] (現在) – hansendo | ||
|---|---|---|---|
| 行 1: | 行 1: | ||
| ====== JavaScriptとSleep ====== | ====== JavaScriptとSleep ====== | ||
| + | JavaScriptのsetTimeoutとclearTimeoutを使ってsleepのような動作を行うサンプルです。 | ||
| + | ===== サンプルの概要 ===== | ||
| + | 3X3に敷き詰められた正方形のDIVにマウスのカーソルを合わせると対象の色が反転します。\\ | ||
| + | Sleep_Offの場合、対象にカーソルを合わせた時点で即時に色が反転します。\\ | ||
| + | Sleep_ONの場合、対象にカーソルを合わせた時点から200ミリ秒後に色が反転します。 | ||
| + | |||
| + | ===== コード ===== | ||
| + | < | ||
| + | jQuery(function($) { | ||
| + | var chotto_matte; | ||
| + | $(' | ||
| + | $(this).toggleClass(' | ||
| + | }); | ||
| + | $(' | ||
| + | var tmp = this; | ||
| + | chotto_matte = setTimeout(function() { | ||
| + | $(tmp).toggleClass(' | ||
| + | }, 200); | ||
| + | }); | ||
| + | $(' | ||
| + | clearTimeout(chotto_matte); | ||
| + | }); | ||
| + | }); | ||
| + | </ | ||
| + | // | ||
| + | ===== DEMO ===== | ||
| + | < | ||
| + | <iframe style=" | ||
| + | </ | ||
| + | ===== 参考文献 ===== | ||
| + | [[http:// | ||
| + | [[http:// | ||
| + | ===== 関連記事 ===== | ||
| + | [[http:// | ||
| + | |||
