Извините за отсутствие примера на этом, но я считаю, что это достаточно легко понять.
У меня есть фиксированный фон на моем сайте, который в настоящее время выполняется следующим образом:
#background {
position: fixed;
top: 0;
bottom: 0;
left: 0;
right: 0;
background-color: #28305e;
background-image: url(../images/background.jpg);
background-size: cover;
-moz-background-size: cover;
background-position: center center;
z-index: -10;
}
<div id="background"></div>
Это замечательно во всех браузерах, за исключением мобильных браузеров, где они скрывают адресную строку при прокрутке вниз. Когда адресная строка скрыта, окно просмотра расширяется по вертикали, а фоновое изображение сотрясает себя. На этом конкретном сайте пользователям будет доступно прокручивать вверх и вниз, и эффект отвлекает.
Любые идеи или стратегии по работе над этим или реализации фона по-другому?
Я мог бы обернуть все содержимое в фиксированном контейнере и установить переполнение-y для прокрутки, что предотвращает скрытие адресной строки, но я бы предпочел не делать этого (Google Glass не может прокручивать те контейнеры, ха-ха... Хотелось бы и демо на нем).
Я пытаюсь придумать что-то, что обеспечивает фоновое изображение: обменивайте функциональные возможности каким-то буфером, чтобы он отображал больше, чем область просмотра, и не будет повторно рендерить, если окно просмотра не будет расширен за пределами этого буфера, но я не уверен, как это реализовать.
РЕДАКТИРОВАТЬ: я действительно реализовал это и подробно описал процесс в ответе ниже. Однако даже с этой настройкой буфера (которая увеличивает высоту фонового изображения на 60 пикселей больше, чем высота окна просмотра), при скрытии адресной строки он по-прежнему показывает пустой сегмент фона, который открывается, и как только вы остановить прокрутку, он отображает остальную часть фонового изображения.
Ищете способ сохранить скрытую функциональность адресной строки (которая теперь расширена до iOS Safari на iPad в iOS 8), а также полноэкранное фоновое изображение, которое всегда полностью отображается, даже если видовой экран меняет высоту, когда скрывая адресную строку. Исследуя, нужно ли мне просто регистрировать отчеты об ошибках для всех браузеров...