https://on-ze.com/archives/7683

スマートフォンやタブレット端末で、デバイスを回転させて画面が縦横に切り替わったときに、イベントの判定処理を行う方法を紹介します。

回転イベント「orientationchange」を使う

デバイスを回転させたときにイベントを発火させるには「orientationchange」を使います。

jQueryでの記述

$(window).on("orientationchange", function() {
	alert ("画面が回転しました" );
});

jQueryを使用しないときの記述

window.addEventListener("orientationchange", function() {
	alert ("画面が回転しました" );
});

「resize」も併用する

より実践的には、「orientationchange」だけでなく「resize」も併記するとベターです。

$(window).on("orientationchange resize", function() {
	alert ("画面が回転しました" );
});

または

window.addEventListener("orientationchange resize", function() {
	alert ("画面が回転しました" );
});

ぜひ参考にどうぞ。

株式会社オンズ制作チーム。 ウェブサイト制作、デザイン制作でお悩みの際はお気軽にご相談ください。

こちらの記事もいかがですか？

アナタにオススメ！ 同じカテゴリーの他の記事です。

![](<https://s3-us-west-2.amazonaws.com/secure.notion-static.com/91853a7d-b634-4376-a76d-622d706bc380/600x360x80-a6404af3cae03b42e54997ca1752d1dc-slitslider.png>)

![](<https://s3-us-west-2.amazonaws.com/secure.notion-static.com/05808f39-ec6b-4e6e-b905-4c77d4ba8cc6/600x360x80-9ba6cca3e6aff99506726b2a7bd0d9af-thumbnail.png>)