Problem with AOS.js not working when Slick.js is on the same page

Question

Seems to be a problem to get AOS.js working properly when there is also a Slick.js slider on the same page. How to get this working having both on the page (Slick slider need to be there)

I have included the scripts and 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();

(also tried with changing some settings differing with: delay, offset, etc. But no luck.

Seems to be a problem caused by Slick-slider. I already tried two other libs (Lax.js and Wow.js) having the same problem (It is even worse in Firefox browser though).

Any advise how to solve this? I do not see it after days of trial and error. Thanks.

This is the live sample: http://testnl10.vini4all.nl/toepassingen/glazuur (aside of the 2 column text) and on the home-page: http://testnl10.vini4all.nl/ (below the banner in the white and gray section)

Answer 1

Found the solution which made it work for me. Insert this code in the app.js:

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

Going through the issues i finally find the soluton which works: https://github.com/michalsnik/aos/issues/635

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