мобильный chrome запускает событие изменения размера при прокрутке

Я использую браузер chrome mobile на galaxy s4, android 4.2.2 и по какой-то причине каждый раз, когда я прокручиваю страницу вниз, он запускает событие изменения размера, проверенное масштабированием изображений из jquery.слайдшоу cycle2.

есть идеи, почему это может происходить?

7 59
android jquery google-chrome scroll

7 ответов:

просто из любопытства я пытался воспроизвести его, и если я прав, это вызвано навигационной панелью chrome.

при прокрутке вниз и chrome скрывает панель навигации браузера он производит изменение размера окна, но это правильно, потому что после этого у нас есть больший размер окна из-за свободного места, которое имеет панель навигации браузера.

обзоры статья: https://developers.google.com/web/updates/2016/12/url-bar-resizing

с уважением!

30

Это звучит странно, но я видел это в других браузерах. Вы можете обойти это так.

var width = $(window).width(), height = $(window).height();

затем в вашем обработчике событий изменения размера вы можете сделать.

if($(window).width() != width && $(window).height() != height){
  //Do something
}

Я не знаю объем ваших функций и все такое, но вы должны получить jist от этого.

60

Я не знаю, это все еще интересно, но мое решение : )

var document_width, document_height;

$(document).ready(function()
{
	document_width=$(document).width(); document_height=$(document).height();
    // Do something
}

$(window).resize(function()
{
    if(document_width!=$(document).width() || document_height!=$(document).height()) 
    {
        document_width=$(document).width(); document_height=$(document).height();
        // Do something
    }
}
3

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

Я столкнулся с этой проблемой в Chrome на android при разработке отзывчивого веб-сайта. При изменении размера окна я хочу скрыть меню (из-за некоторых элементов дизайна, требующих правильного позиционирования), но поведение Chrome для android для запуска события изменения размера при прокрутке сделало это несколько трудный..

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

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

Я попытался реализовать решение, предложенное CWitty, но поскольку прокрутка вверх или вниз фактически запускает изменение высоты, которое тоже не сработало.

Я закончил тем, что добавил условие, которое скрывает меню только при изменении ширины, а не при изменении высоты. Это работает в моем случае, так как мне нужно только переписать меню при изменении ширины.

1

Это дубликат событие изменения размера Javascript на scroll mobile

чтобы исправить это, используйте onOrientationChange и window.свойство orientation. Смотрите соответствующий ответ:здесь

0

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

Я знаю, что это не идеально для ссылки на внешний ресурс, но QuirksMode имеет читаемую таблицу, которую я не хочу дублировать (или поддерживать) здесь: http://www.quirksmode.org/dom/events/resize_mobile.html

просто чтобы привести пример, тот, который получал нас: по-видимому, во многих браузерах открытие мягкой клавиатуры запускает событие.

0

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

0