Обнаружение вращения телефона Android в браузере с помощью JavaScript

188

Я знаю, что в Safari на iPhone вы можете обнаружить ориентацию экрана и изменение ориентации, прослушивая onorientationchangeсобытие и запрашивая window.orientationугол.

Возможно ли это в браузере на телефонах Android?

Чтобы было ясно, я спрашиваю, можно ли обнаружить вращение устройства Android с помощью JavaScript, работающего на стандартной веб-странице. Это возможно на iPhone, и мне было интересно, можно ли это сделать для телефонов Android.

javascript android webkit

— philnash
источник

214

Чтобы обнаружить изменение ориентации в браузере Android, присоедините слушателя к событию orientationchangeили :resizewindow

// 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);

Проверьте window.orientationсвойство, чтобы выяснить, в каком направлении ориентировано устройство. С телефонов Android, screen.widthа screen.heightтакже обновлений, как устройство поворачивается. (это не тот случай с iPhone).

— ДБ.
источник

это действительно работает? я пробовал jquery $ (окно) .bind ("directionalchange", fn); но это не сработало, я должен использовать форму выше? я попробовал "onorientationchange" в окне, оно возвращает false

— Ayyash

Это работает хорошо. Айяш - весь смысл в том, что, когда «directionalchange» не поддерживается, он возвращается к «изменению размера»

— Дрор

На дроиде это совершенно безумно. Он отображает screen.width 320, когда телефон поворачивается в ландшафтном режиме, и обнаруживает screen.width 569, когда телефон поворачивается в портретном режиме! Как придешь??

— Игорь Ганапольский

Просто чтобы уточнить: Те, кто ищет решение, которое также работает на iOS, должны взглянуть на два-дурака или мой ответ.

— mklement0

Нет необходимости использовать двух-битный взломать для iOS. Просто используйте screen.width и screen.height на Android и на iOS, используйте window.innerWidth и window.innerHeight.

— Джастин