it-swarm.com.ru

Что делает стиль Apple-mobile-web-app-status-bar-style?

Что значит

<meta name="Apple-mobile-web-app-status-bar-style" content="black">

сделать - может кто-нибудь объяснить на примере?

Я нашел эту строку в официальной библиотеке разработчиков Safari

Этот метатег не имеет никакого эффекта, если только вы сначала укажите полноэкранный режим как описано в «URL».

Но какой URL?

В чем выгода этого метатега?

22
Jitendra Vyas

Во-первых, подсказка Apple-mobile-web-app-capable должна быть установлена, чтобы это работало. Эта подсказка заставляет веб-приложение работать в полноэкранном режиме: оно удаляет адресную строку и кнопки навигации, которые вы получаете по умолчанию в Mobile Safari. Удаленные области выделены красным здесь:

Apple mobile web app capable

Таким образом, когда приложение находится в полноэкранном режиме (то есть пользователь добавил веб-сайт на свою домашнюю страницу), вы также можете контролировать цвет оставшейся тонкой строки состояния в верхней части страницы с помощью Apple-mobile-web-app-status-bar-style, выделенного красным здесь :

Apple mobile web app status bar style

Согласно документам:

Если для содержимого установлено значение default, строка состояния отображается нормально. Если установлено значение black, строка состояния имеет черный фон. Если установлено значение black-translucent, строка состояния будет черной и полупрозрачной. Если установлено значение по умолчанию или черный, веб-контент отображается под строкой состояния. Если установлено значение black-translucent, веб-контент отображается на весь экран, частично скрытый строкой состояния.

Несколько предостережений:

  1. Это работает только на first странице, которую вы загружаете; любая навигация на другую страницу вызовет появление адресной строки и кнопок навигации. Поэтому, если вы хотите, чтобы это работало, вы должны создать одностраничный веб-сайт (для нескольких «страниц» рассмотрите подход к загрузке страниц Ajax, такой как тот, который используется в инфраструктуре jQuery Mobile).

  2. Это работает только когда вы заходите на веб-страницу через ярлык приложения; если вы переходите на сайт прямо из Mobile Safari, это не имеет никакого эффекта.

46
Ben

Он меняет верхнюю панель с баннером и носителем на нем и делает его полупрозрачным черным.

0
Anonymous