0

Разрабатываю сайт. Столкнулся с проблемой, когда при прокрутке в Chrome на Android меняется высота элемента. Стоит упомянуть, что я устанавливаю высоту для определенного элемента равной высоте экрана:

    var el = jQuery('#first-screen');

jQuery(window).resize(function () {
        el.height(jQuery(window).height());
    })

Но при скролле в Chrome, в то время как либо появляется либо пропадает строка адресса, высота элемента меняется на 56px. Что приводит к неприятным скочкам контента.

Как данное можно пофиксить?

PS. Адресс сайта - crystal.ananas.net.ua

1 ответ 1

1

Если я правильно понял суть проблемы и поведение хрома в моем мобильнике совпадает со всеми остальными, то мобильный хром при скролле страницы вниз от начального(верхнего) положения убирает панельку адреса сайта вверху, из-за чего происходит ресайз документа. В свою очередь ваш скрипт реагирует на это изменение и подгоняет верхний блок под новый размер. Результат - документ дергается.

В качестве решения проблемы могу лишь посоветовать убрать подгонку верхнего элемента при ресайзе. Почему? Потому-что конечный пользователь скорее всего не будет специально изменять размер сайта, чтобы увидеть как он адаптируется. Если адаптация под мобильники так важна, то действие изменения размера первого блока вешайте не на ресайз документа, а на изменение разрешения(вертикально/горизонтально) - когда ширина документа становится больше высоты(и наоборот)

Либо можно привязаться к изменению ширины документа.

1
  • Буду пробывать вешать на изменение ориентации девайса. По поводу вешать на изменение ширины. Можно поподробнее?
    – wkornilow
    5 мар 2016 в 15:23

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.