Initial Site

Initial Site

Initial Site

jQuery のちょこっとメモ

  • ササキ  2015/02/26 12:44
jQueryメモ

制作していてこんなことしたいけど、どうやるんだ?って思ったとき調べたことのメモです。

イベントハンドラ(window.load とか reseize)を同時に指定したい(=同じ処理したい)!

レスポンシブサイトとかで使わないといかんって場面結構あると思います

ひとつひつ書くとこんな風に、処理A を三回も書かないといけない

$(function(){
$(window).load(function(){
//処理A
});
$(window).scroll(function(){
//処理A
});
$(window).resize(function(){
//処理A

});

});

けど、まとめて各以下の記述なら一回で済む

$(function(){
$(window).on('load scroll resize',function(){
//処理A
});
});

ウインドウの処理が終わったときだけに、resize 処理をいれたい
ふつうに書くと以下の記述で問題なくやってしまうのですが、同ページ内にいろいろな処理が書かれているとウインドウをリサイズしている間も処理が動いて余計な負荷がかかってしまいます。

$(window).resize(function() {
//処理B
});

そこで

リサイズが終わったときだけ処理をする方法に変えれば、よろしい事になるのでは


var timer = false;
$(window).resize(function() {
if (timer !== false) {
clearTimeout(timer);
}
timer = setTimeout(function() {
// 処理B
}, 200);
});

最後に書いてある 200 って数字は、 200ミリ秒(1秒=1000ミリ秒)後に 処理B を行うっていう時間の指定です。


コメントをどうぞ

技術の記事

  1. 2
    photoshopで簡単な加工からそれなりに綺麗にする方法
  2. pixta_4153512_M
    夏バテ気味のようです。
  3. CropperCapture1
    【ターゲットブランク】target=_blankなのか。target=blankなのか。それとも、target=newなのか。WEB屋のメモ帳
  4. lgi01a201404292200
    プログラマは稼げるのか?

おすすめ記事

  1. イニシャルサイトコーポレートサイト
    コーポレートサイトをリニューアルしました
  2. なんでもQ
    相談Q&Aサイト「なんでもQ」開発中です!
  3. さんぽすフォトコンペ開催中
    今年もさんぽすフォトコンペ開催しました!

人気の記事

  1. ファミコン
    パズドラ、モンスト、白猫に続く次のゲームは…?
  2. konagaya_20150303
    日常でつい使ってしまう間違えやすい日本語
  3. konagaya20150513
    初心者でも気軽に登れて絶景が見れる山
  4. BBQ
    グループ会社合同フットサル&バーベキュー大会に参加しました(BBQ編)