Изменить макет iPad / iPhone, если пользователь добавляет на главную страницу

Question

В iPhone / iPad вы можете удалить адресную строку с помощью мета-тега на своей странице.Однако это работает, только если пользователь нажимает кнопку «Добавить на главную страницу».

Для получения дополнительной информации Полный экран iPad WebApp в Safari

Мне нужно найти способ немного изменить CSS, если пользователь просматривает страницу без адресной строкит.е. доступ к сайту с домашней страницы.).

padding-top:64px;

Кто-нибудь нашел способ решить эту проблему?

Answer 1

Вы должны посмотреть на window.navigator.standalone в JS, а затем, например, установить standalone class на HTML element, чтобы вы могли добавить следующее правило к вашему CSS, которое будет применяться только при добавлении страницы вдомашняя страница:

.standalone .yourElement {
    padding-top: 64px;
}