Высота веб-страницы растягивается в мобильном сафари

Question

Я создал сайт, и он отлично работает на всех платформах, кроме мобильного сафари, где высота страницы растянута и после того, как первая страница щелчка перестает отвечать на запросы.

html,body { 
    height:100%; 
    background:center no-repeat fixed url('../asset/images/logo1.jpg'); 
    background-size: cover; 
    color:#444; 
    font-family: 'Lato', sans-serif; 
} 

Мои мета-теги:

<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0"> 

любая помощь, спасибо.

** Edit: ** Website in question

Answer 1

Первая проблема заключается в том, что фреймы являются устаревшими, и не удивительно, что его его вызывает проблемы на сафари iPhone. См. - https://developer.mozilla.org/en/docs/Web/HTML/Element/frameset.

Во-вторых - зачем вам нужно 100% тело и высота html? Даже если вы хотите, чтобы высота была минимальной на 100%, сделайте min-height: 100vh для тела.

В-третьих - Даже набор фреймов не используется должным образом. Вы включаете содержимое веб-сайта - http://satyam.esy.es/HealthFriends/ на сайт - http://healthfriends.in/. Так почему бы не скопировать вставку содержимого и активов, поскольку в наборе фреймов нет дополнительных кадров.

Последнее - Если вы не можете вытащить активы из домена satyam.esy.es, тогда может возникнуть проблема, что вам придется самостоятельно разрабатывать активы. В этом случае также создайте запросы cdn для начальной загрузки, datepicker и moment.js. И напишите свои собственные css и js.

О вашей проблеме с iPhone. Конечно, фреймы создают проблемы. Но может быть и что-то еще. Вам нужно использовать Mordenizr, чтобы проверить, какие функции работают для iOS Safari, а затем использовать правильные полисы.

Надеюсь, это поможет вам отлаживать и развивать. Thanks