Мобильное устройство обнаруживает ориентацию, заблокированную в javascript / HTML5 - PullRequest
0 голосов
/ 20 марта 2019

У меня есть веб-игра html5, которую я разрабатываю и которая требует, чтобы мобильные устройства были в альбомном режиме. Поскольку я не могу принудительно вращать некоторые устройства / браузеры (Safari), чтобы настроить альбомную ориентацию, я просто вращаю свой HTML-контент с помощью приведенного ниже CSS.

Проблема, с которой я столкнулся, заключается в том, что на мобильных устройствах (iPhone), если пользователь заблокировал свое устройство в портретном режиме, это портит впечатление (рамка браузера не будет вращаться в соответствии с содержимым ландшафта). Мне нужно отобразить сообщение, чтобы сообщить им, что им нужно разблокировать устройства. Я не смог определить, существует ли какой-либо метод javascript для обнаружения, если их мобильное устройство явно заблокировано в портретном режиме. Я нашел старые посты (2015), в которых говорилось, что это невозможно, но я надеюсь, что поддержка функций улучшилась. Я ознакомился с API-интерфейсом «Ориентация экрана», однако ориентация по умолчанию отличается от явной заблокированной ориентации.

Мой CSS для форсирования ландшафта:

@media only screen and (max-device-width: 1024px) and orientation:portrait) {
    body {
        -webkit-transform: rotate(90deg);
        -moz-transform: rotate(90deg);
        -ms-transform: rotate(90deg);
        -o-transform: rotate(90deg);
        transform: rotate(90deg);
        width: 100%;
        height: 100%;
        overflow: hidden;
        position: absolute;
        top: 0;
        left: 0;
    }
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...