Проблема с AOS.js не работает, когда Slick.js находится на той же странице

Кажется, проблема заставить AOS.js работать правильно, когда на той же странице есть слайдер Slick.js. Как заставить это работать, имея оба на странице (там должен быть слайдер)

Я включил скрипты и css

<script src="https://cdnjs.cloudflare.com/ajax/libs/aos/2.3.4/aos.js"></script>
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/aos/2.3.4/aos.css" media="all"> 

Inserted the <div data-aos="zoom-in"></div>

And initiated the AOS.js     AOS.init();

(также пытался изменить некоторые настройки, отличающиеся: задержкой, смещением и т.д. Но не повезло.

Кажется проблема вызвана Slick-slider. Я уже пробовал две другие библиотеки (Lax.js и Wow.js) с той же проблемой (хотя в браузере Firefox она еще хуже).

Любой совет, как это решить? Я не вижу этого после нескольких дней проб и ошибок. Благодарю.

Это живой пример: http://testnl10.vini4all.nl/toepassingen/glazuur (помимо текста в 2 столбца) и на домашней странице: http://testnl10.vini4all.nl/ (под баннером в бело-серая секция)

1 ответ

Нашел решение, которое заставило меня работать. Вставьте этот код в app.js:

$(window).on("scroll", function () {
     AOS.init();
 });

Пройдя через проблемы, я наконец нахожу решение, которое работает:https://github.com/michalsnik/aos/issues/635

https://github.com/kenwheeler/slick/issues/3406

Другие вопросы по тегам