Im testing the animation on scroll script(https://michalsnik.github.io/aos/) that is listening for the window “resize” event.
It is suppose to animate a div when it is in the middle of the screen.
It say in their docs that
refresh
- recalculate all offsets and positions of elements (called on window resize)
So it is listening for the window.resize event.
So when I load my page Im running this.
$$(document).on('page:init', '.page[data-name="apple"]', function (e) {
var page = e.detail;
//init the animation script...
AOS.init();
//since the script is listening to the "resize" event Im triggering it here...
$$(window).trigger('resize');
//AOS.refresh();
});
But this doesnt work, it is not running the animation.
But if I acually resize the browser window by draging and changing the size of it, then it works.
Then the animation is running.
So how can I trigger the resize event when I load the page?