JavaScript가 브라우저에서 Android 휴대폰 회전을 안정적으로 감지할 수 있습니까?

JavaScript가 브라우저에서 Android 기기 회전을 감지할 수 있나요?

브라우저에서 화면 방향 감지

iPhone의 Safari에서 화면 방향 변경은 onorientationchange 이벤트를 통해 감지할 수 있습니다. 그러나 질문이 생깁니다. Android 휴대폰에서 유사한 방향 감지 기능을 제공할 수 있습니까?

JavaScript 및 Android 휴대폰 회전

Android 기기에서 방향 감지 동작은 크게 다릅니다. resize 및 orientationChange 이벤트는 일관되지 않은 빈도로 서로 다른 시퀀스로 실행될 수 있습니다. 또한 screen.width 및 window.orientation과 같은 값은 항상 예상대로 업데이트되지 않습니다.

회전 감지를 위한 안정적인 접근 방식

신뢰성을 보장하려면 구독하는 것이 좋습니다. 크기 조정 및 방향 변경 이벤트 모두. 또한 누락된 이벤트를 캡처하기 위해 폴링 메커니즘을 구현할 수 있습니다.

<code class="javascript">var previousOrientation = window.orientation;
var checkOrientation = function(){
    if(window.orientation !== previousOrientation){
        previousOrientation = window.orientation;
        // orientation changed, take appropriate actions
    }
};

window.addEventListener("resize", checkOrientation, false);
window.addEventListener("orientationchange", checkOrientation, false);

// (optional) Android may fail to fire events on 180 degree rotations
setInterval(checkOrientation, 2000);</code>

장치별 결과

다양한 장치에서 테스트한 결과 불일치가 발견되었습니다. iOS 장치는 일관된 동작을 보이는 반면 Android 장치는 변형을 나타냅니다. 아래 표에는 관찰된 결과가 요약되어 있습니다.

Device	Events Fired	Orientation	innerWidth	screen.width
iPad 2 (landscape to portrait)	resize, orientationchange	0, 90	1024, 768	768, 768
iPad 2 (portrait to landscape)	resize, orientationchange	90, 0	768, 1024	768, 768
iPhone 4 (landscape to portrait)	resize, orientationchange	0, 90	480, 320	320, 320
iPhone 4 (portrait to landscape)	resize, orientationchange	90, 0	320, 480	320, 320
Droid phone (portrait to landscape)	orientationchange, resize	90, 90	320, 569	320, 569
Droid phone (landscape to portrait)	orientationchange, resize	0, 0	569, 320	569, 320
Samsung Galaxy Tablet (landscape to portrait)	orientationchange, orientationchange, orientationchange, resize, orientationchange	0, 90, 90, 90, 90	400, 400, 400, 683, 683
Samsung Galaxy Tablet (portrait to landscape)	orientationchange, orientationchange, orientationchange, resize, orientationchange	90, 90, 0, 90, 90	683, 683, 683, 400, 400

따라서 브라우저에서 JavaScript를 사용하여 Android 휴대폰 회전을 감지하는 것이 가능하지만 동작은 기기마다 다르며 안정성을 보장하려면 강력한 접근 방식이 필요합니다.

위 내용은 JavaScript가 브라우저에서 Android 휴대폰 회전을 안정적으로 감지할 수 있습니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!