1

Проблема следующего характера: Сайт написан на html, js vanilla, css, gsap. При скролле на мобильном устройстве почему-то рефрешит iframe, мигает много раз. Ребят, кто сталкивался, из-за чего это может происходить? Мыслей вообще нет на этот счёт. Использовал scrollTrigger.refresh() только одиножды и то на другой странице при нажатии на кнопки, которых на этой странице нет. Есть видео, только хз, как сюда его прикрепить

Обновление информации, я выяснил, что контент рефрешится при скролле вверх/вниз из-за табов, в которых находится контент. Продолжаю искать корень бажины.

5
  • Так как на десктопе такой проблемы нет, может кто знает, как отследить это на мобилке? Есть ли мобильный симулятор, на котором всё отображается, как на телефоне? Ну или хотябы посмотреть консоль на мобилке xD Commented 10 июл. 2023 в 14:49
  • 1
    В хроме F12 - Ctrl + Shift + M не воспроизводить проблему?
    – TemirStack
    Commented 10 июл. 2023 в 15:05
  • @TemirStack , не, я там в первую очередь посмотрел) Дело в том, что у меня сузился круг поиска, потому что видео не моргает в новостях и на странице конфиденциальности (добавил для теста), а это значит, скорее всего, что дело в фиксированном споллере, потому что там его нет, а тут есть) Commented 10 июл. 2023 в 15:12
  • Всё-таки не из-за споллера :( Commented 10 июл. 2023 в 15:17
  • @TemirStack , если что - я нашёл ответ проблемы, описал её ниже ))) Commented 10 июл. 2023 в 16:03

1 ответ 1

0

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

window.addEventListener('resize', evt => {
             const resizeWidth = evt.currentTarget.innerWidth
             if (resizeWidth < 600) restructionDetail(on)
             if (resizeWidth > 600) restructionDetail(off)
        })
        ;(function () {
            if (window.innerWidth <= 600) restructionDetail(on)
        })()
    }

Вообщем, у меня вёрстка выстроена таким образом, что контент разложен в 3 таба, если ширина экрана меньше 600px, то она джаваскриптом переносит контент из табов в другое место на странице, для более удобного отображения контента.

В коде, который я прикрепил, стоит слушатель событий на window, слушает изменения размера экрана. В моём случае было бы достаточно нижней iife, которая вызывает функцию реконструкции страницы, но почему-то в мой больной мозг пришла мысль написать ещё один этап проверки, но из-за того, что на мобилке первая проверка (if (resizeWidth < 600) restructionDetail(on)) всегда возвращает тру, то при изменении разрешения хотя бы на 1px, срабатывает повторная реконструкция и рефреш iframe вместе с остальным контентом. Вот и всё). Решил проблему просто удалив первые два if.

Ваш ответ

Нажимая «Отправить ответ», вы соглашаетесь с условиями пользования и подтверждаете, что прочитали политику конфиденциальности.

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