Фон всегда заполняет окно браузера, даже в мобильных браузерах?

Я пробовал ответы на Растягивание и масштабирование фона CSS (а также http://css-tricks.com/3458-perfect-full-page-background-image/) и прекрасно работает в Firefox и Chrome, но оба метода не работают в браузере Android. Оба метода терпят неудачу одинаково: когда я прокручиваю вниз, фон остается позади, поэтому я получаю белый фон. (Вы можете увидеть проблему, просмотрев эту страницу в браузере Android: http://css-tricks.com/examples/FullPageBackgroundImage/progressive.php)

Когда я начинаю прокручивать, происходит начальный скачок фона; Я думаю, это связано с тем, что поле местоположения больше не отображается (т.е. размер окна браузера увеличился).

Поведение в основном такое же, когда телефон поворачивается из альбомной ориентации в портретную; это труднее увидеть в приведенном выше примере URL, так как фон в этом примере почти заполняет высоту. Когда текст длиннее, он разрывается таким же образом.

Android версии 2.2.1, встроенный браузер webkit.

Поведение другое, но такое же неправильное, с оперой мобайл: когда я прокручиваю, происходит задержка в полсекунды, затем фон прыгает. Но также фон заполняет только около 80% высоты, поэтому вверху или внизу экрана есть белый блок. (Это решение «img с более низким z-индексом»; решение css3 для размера фона вообще не работает в Opera Mobile.)


person Darren Cook    schedule 18.10.2011    source источник


Ответы (1)


Вы пробовали свойство media в css.

Ее ссылка

Медиа-запросы CSS3

Вы можете использовать разные CSS в зависимости от разрешения экрана

person Exor    schedule 18.10.2011
comment
Спасибо @Exor, это ответит на следующий вопрос, но на данный момент я просто не знаю, как сделать эффект в Android (или даже если это возможно). - person Darren Cook; 18.10.2011