메인메뉴 바로가기

HOME으로 가기


Javascript

모바일웹 | OrientationChange; - 모바일 회전변경 이벤트

본문

onorientationchange​ : 방향이 변경될때 일어나는 이벤트


window.orientation : 현재 모바일 방향(각도) 속성

0 : 세로, -90: 가로, 90: 가로

 

 

 

----- 각 방향 별 적용CSS 설정함수 예제 -----------

 

------------CSS----------- 

<link rel="StyleSheet" href="세로모드CSS파일" type="text/css" id="orient_css"> ​ 

 

------------JS----------- 

function orient() 

   switch(window.orientation){  
      case 0: document.getElementById("orient_css").href = "세로모드 CSS파일";  break; 
      case -90: document.getElementById("orient_css").href = "가로모드 CSS파일";  break; 
      case 90: document.getElementById("orient_css").href = "가로모드CSS파일";  break; 
   } 

window.onload = orient(); 


------------HTML----------- 
<body onorientationchange="orient();"> 
....

 

  • 페이스북으로 보내기
  • 트위터로 보내기
  • 구글플러스로 보내기