Javascript Cookbook

사파리의 방향 전환 이벤트와 다른 모바일 개발 환경 사용하기

문제

사파리 브라우저로 웹 페이지에 접근한 후 세로 보기 모드에서 가로 보기 모드로 방향이 전환됐을 때를 탐지하고 싶습니다.

해결

사파리 전용의 방향 전환 이벤트를 사용하면 된다.

window.onrientationchange = function(){ var orientation = window.orientation; switch(orientation){ case 0: //세로 방향 break; case 90: case -90: //가로 방향 break; } }

설명

해결에서는 아이폰 같은 기기의 방향이 세로에서 가로로 바뀌는 방향 전환 이벤트를 포착한 후 새로운 방향을 탐지했다.