以前制作したレスポンシブなWebサイトを、久しぶりにiOSでチェックしてみたらなんだか様子がおかしい。
どうやらjQueryのorientationchangeイベントを検出できていないらしい・・・
$(window).on('resize orientationchange scroll', function(obj) {
if (obj.type == 'resize') {
// リサイズ時
} elseif (obj.type == 'orientationchange') {
// 向き変更時
} elseif (obj.type == 'scroll') {
// スクロール時
}
});
このように、orientationchangeとscrollを同時に検出しようとしている場合。
当然、デバイスの向きを変えた場合はorientationchangeイベント、スクロールした場合はscrollイベントの検出を期待するのですが、どういうわけかどちらもscrollイベントになってしまう。
orientationchangeイベントだけにすればちゃんと検出できます。
向きを変えると多少スクロールしてしまいますから、おそらくその瞬間にscrollイベントを優先して検出してしまっているのでしょう。
素直にscrollイベントだけ分離させます。
$(window).on('resize orientationchange', function(obj) {
if (obj.type == 'resize') {
// リサイズ時
} elseif (obj.type == 'orientationchange') {
// 向き変更時
}
});
$(window).on('scroll', function() {
// スクロール時
});


