Блог

У меня проблема с новым веб-сайтом, над которым мы работаем. Мы используем адаптивный CSS с медиа-запросами. Проблема, с которой мы сталкиваемся, заключается в том, что при изменении ориентации телефона CSS не меняется (иногда) до тех пор, пока страница не будет обновлена.

Есть ли возможность автоматически обновлять браузер при изменении ориентации телефона?

Я нашел ссылку на раздел Safari Web «Ориентация», который может помочь (обработка событий ориентации)? https://developer.apple.com/library/archive/documentation/AppleApplications/Reference/SafariWebContent/HandlingEvents/HandlingEvents.html

Попробуйте это:

Решение 1

 window.onorientationchange = function()
{
   window.location.reload();
}
 

Решение 2

 if (window.DeviceOrientationEvent) {
    window.addEventListener('orientationchange', function() { location.reload(); }, false);
}
 

Ваш сайт перезагрузится при изменении ориентации телефона.

Вот 3 способа работы с ориентацией устройства, которые могут быть полезны:
http://davidbcalhoun.com/2010/dealing-with-device-orientation