Where The Streets Have No Name

모바일 웹에서 orientationchange 본문

Developement/Mobile

모바일 웹에서 orientationchange

highheat 2011. 8. 30. 14:12
<!DOCTYPE html>
<html>
<head>
<title>Orientation Checker</title>
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximumscale=1.0; user-scalable=0;" />
<script type="text/javascript" src="/js/jquery-1.6.1.min.js"></script> 
<script type="text/javascript">
/*
 * ios, android 둘다 지원되는 스크립트 
 */	
var ori_status;	

$(document).ready(function() {	
	window.onorientationchange = changeOrientation;
  	window.setTimeout(changeOrientation, 0);		
});

// event handler
function changeOrientation(){
	if(ori_status == detectOrientation())return;
	ori_status = detectOrientation();    	
	alert(ori_status);	
}

function detectOrientation(){
	var orientation = window.orientation; 
	var rtn;

	switch(orientation) {  
   		case 90: case -90:  
       		rtn = 'landscape';  
   			break;  
   		default:  
       		rtn = 'portrait';  
   	}  
	return rtn;
}
</script>
</head>
<body>

</body>
</html>