Detect rotation of Android phone in the browser with javascript

Question

I know that in Safari on an iPhone you can detect the screens orientation and change of orientation by listening for the onorientationchange event and querying window.orientation for the angle.

Is this possible in the browser on Android phones?

Update

To be clear, I am asking whether the rotation of an android device can be detected by JavaScript running on a standard web page. It is possible on an iPhone and I wondered whether it could be done for Dndroid phones.

Thanks

Answer 1

You might want to check out this site: http://androidguys.com/?s=rotational+forces&x=9&y=9.

Answer 2

You could always listen to the window resize event. If, on that event, the window went from being taller than it is wide to wider than it is tall (or vice versa), you can be pretty sure the phone orientation was just changed.

Answer 3

The short answer is "YES". To detect an orientation change on an Android browser, add a listener for either the 'orientationchange' or 'resize' event on window:

// Detect whether device supports orientationchange event, otherwise fall back to
// the resize event.
var supportsOrientationChange = "onorientationchange" in window,
    orientationEvent = supportsOrientationChange ? "orientationchange" : "resize";

window.addEventListener(orientationEvent, function() {
    alert('HOLY ROTATING SCREENS BATMAN:' + window.orientation + " " + screen.width);
}, false);

You can then check the window.orientation property to figure out which way the device is oriented. With Android phones, screen.width or screen.height also updates as the device is rotated. (this is not the case with the iPhone).