Category WEB Tips Update 2015.07.02
jQueryで画面サイズの変更時の対応は通常はresizeにて処理をしていましたが、
レスポンシブWEBデザインで実装する場合にスマートフォンの回転も考慮しなければなりません。
下記にて
・PCの画面リサイズ時
・スマートフォンの回転時
の処理を一括して処理ができます。
var timer = false; $(window).on("orientationchange resize",function(){ if (timer !== false) { clearTimeout(timer); } timer = setTimeout(function() { //console.log('ここに実行したい処理を記述'); }, 100); });
連続読み込みをさせないようにタイマー変数を宣言します。
window onにて
PC … resize
スマートフォン … orientationchange
それぞれの動きを判定させます。
後記するsetTimeoutにて指定した時間中は連続実行させなくします。
実行したい処理を記述します。