私はgalaxy s4、android 4.2.2でクロームモバイルブラウザを使っていますが、ページを下にスクロールするたびに、なぜかリサイズイベントが発生し、jquery.cycle2スライドショーの画像の拡大縮小が検証されています。
なぜこのようなことが起こるのか、何か心当たりはありますか?
不思議な感じですが、他のブラウザで見たことがあります。 このように回避することができます。
var width = $(window).width(), height = $(window).height();
のようにすると、リサイズイベントハンドラの中で、こうすることができます。
if($(window).width() != width || $(window).height() != height){
//Do something
}
関数のスコープやその他もろもろは分かりませんが、これで大まかなことは分かるはずです。
この質問にはすでに回答がありますが、この質問ではレスポンシブ・サイトの問題は出てきませんので、それについて補足しておきます。
レスポンシブWebサイトを開発する際に、アンドロイドのChromeでこの問題に遭遇しました。ウィンドウのサイズを変更するときに、メニューを隠したいのですが(適切な位置が必要なデザイン要素があるため)、スクロール時にresizeイベントをトリガーするアンドロイド用クロームの動作が、それをやや難しくしていました。
このサイトはレスポンシブWebサイトなので、デスクトップPCでは向きが変わりませんが、通常のPC、タブレット、スマートフォンの両方で動作するコードが必要だったため、onOrientationChangeの使用に切り替えるという選択肢はありませんでした。
ブラウザのスニッフィングなどを始めることもできたのですが、今のところそれは回避できています...。
CWittyが提案した解決策を実装しようとしましたが、上下にスクロールすると高さが変わるので、これもうまくいきませんでした。
結局、高さが変わったときではなく、幅が変わったときだけメニューを隠すという条件を追加することにしました。私の場合、幅が変わったときだけメニューを書き換えればよいので、これでうまくいきました。
この記事は、Javascript resize event on scroll mobileと重複しています。
修正するためには、onOrientationChangeとwindow.orientationプロパティを使用します。 関連する回答を参照してください。こちらをご覧ください。