02.09.2020, 12:41
|
Аспирант
|
|
Регистрация: 18.03.2017
Сообщений: 30
|
|
Проблема с поиском кода JS по сайту отвечающего за некоторую работу.
Здравствуйте. Столкнулся с проблемой. Есть сайт (лендинг). При первом скроллинге (вниз), элементы DOM последовательно анимируются (плавное появление и небольшой плавный сдвиг).
Вопрос в том, как проще всего найти на сайте JS код который отвечает за смену CSS-классов анимирующихся DOM-элементов.
Раньше проблем не возникало. Но в очередном сайте (смотрю в панели разработчика), анимация происходит следующим образом:
- когда при скроллинге я дохожу до очередного анимирующегося элемента, ему добавляются два класса которые отвечают за анимацию и через пару миллисекунд эти классы удаляются. Времени заметить что это были за классы очень мало. Раньше код JS я просто искал именно по названию классов. Если в JS файле есть эти CSS-классы (тупо их названия), то определял оно не оно, и если не оно, то производил поиск этих классов в следующем файле *.js, пока не найду то что нужно.
В данном случае я просто не успеваю заметить названия классов, только вижу что их два. Конечно после 100 попыток получилось разобрать названия классов CSS, но это ведь не выход.
Если кто понял что я хотел, напишите плиз как можно найти JS-код отвечающий за работу того или иного элемента DOM. Спасибо.
|
|
02.09.2020, 12:48
|
Профессор
|
|
Регистрация: 14.01.2015
Сообщений: 12,990
|
|
В FF, в инспекторе, видно каким элементам какие обработчики установлены, раскрыв этот список можно увидеть и код, и перейти в отладчик его. Для хрома есть плагин, который также позволяет отметить установленные обработчики элементам.
|
|
02.09.2020, 12:53
|
Профессор
|
|
Регистрация: 04.12.2012
Сообщений: 3,791
|
|
Сообщение от laimas
|
Для хрома есть плагин, который также позволяет отметить установленные обработчики элементам.
|
Разве это не встроенная фича инспектора?
Да и вряд ли так получиться найти слушателя, ведь слушаются не события элемента, а события скролла.
|
|
02.09.2020, 13:00
|
Аспирант
|
|
Регистрация: 18.03.2017
Сообщений: 30
|
|
Чтобы было понятнее, вот сайт: http://m911.by/
Большинство элементов анимируются (opacity и transform) ,благодаря коду JS который добавляет-удаляет этим элементам классы-CSS.
Например мне надо найти код JS который это делает и отменить его (удалить функцию вообще или добавить в нее другой класс).
Как этот код-JS найти?)
|
|
02.09.2020, 13:05
|
Профессор
|
|
Регистрация: 14.01.2015
Сообщений: 12,990
|
|
Сообщение от Nexus
|
Разве это не встроенная фича инспектора?
|
У кого? Не видел подобного у Хрома, а с плагином да. У Лисы в отладчике эта фича встроена.
Сообщение от Nexus
|
Да и вряд ли так получиться найти слушателя
|
Это смотря что, естественно динамически устанавливаемые обработчики не будут отображаться, все остальное есть.
Последний раз редактировалось laimas, 12.10.2020 в 16:58.
|
|
02.09.2020, 13:10
|
Профессор
|
|
Регистрация: 04.12.2012
Сообщений: 3,791
|
|
У элемента есть обработчик события окончания анимации, но ссылается он на jq, что ни о чем не говорит.
Нужный вам файл: assets/theme/js/script.js
Ищите строку: fadeInUp
|
|
02.09.2020, 13:12
|
Профессор
|
|
Регистрация: 04.12.2012
Сообщений: 3,791
|
|
Сообщение от laimas
|
У кого? Не видел подобного у Хрома
|
Вот только что им в хроме воспользовался.
|
|
02.09.2020, 13:37
|
Аспирант
|
|
Регистрация: 18.03.2017
Сообщений: 30
|
|
Сообщение от Nexus
|
У элемента есть обработчик события окончания анимации, но ссылается он на jq, что ни о чем не говорит.
Нужный вам файл: assets/theme/js/script.js
Ищите строку: fadeInUp
|
Я нашел, спасибо, вы мне лучше подскажите как вы нашли. Явно не моим пещерным способом)
|
|
02.09.2020, 13:40
|
Профессор
|
|
Регистрация: 14.01.2015
Сообщений: 12,990
|
|
Сообщение от Nexus
|
но ссылается он на jq, что ни о чем не говорит
|
Ссылка указывает на событие/обработчик, собственно зачастую код обработчика виден непосредственно в списке, и не обязательно он указывает на jq.
|
|
|
|