CSS обходной путь для iPhone отзывчивый дизайн ошибка

Question

Я создал новую страницу для нашего социального клуба и имею некоторые проблемы с ней. Это отзывчивый сайт с одностраничным дизайном. На вступительном разделе есть только фоновое изображение с простым логотипом.

Теперь все выглядит хорошо на Android и большинстве браузеров, но почему-то браузер iphone показывает увеличение фонового изображения.

Кто-нибудь знает обходное решение для этого?

Вы можете попробовать сами на http://juku-tbg.de/

Chrome Скриншот: -> OK

Iphone Mode на Chrome: -> OK

Скриншот из андроида устройство: -> OK

Скриншот на iPhone 5s: -> NOK

спасибо.

Answer 1

background-attachment: fixed прослушивается в мобильном Safari. Для исправления используйте отдельный контейнер и примените вместо него position: fixed.

#bg { 
    background-image: url('path/to/img.jpg'); 
    background-attachment: scroll; 
    background-position: center top; 
    background-repeat: no-repeat; 
    display: block; 
    width: 100%; 
    min-height: 100%; 
    z-index: -100; 
    position: fixed; 
    top: 0; 
    left: 0; 
}