If I have a long page, how do I check when a div comes into the view(scrolling up), or even better when the div is in the middle or in top of the view?
For example.
Lets say I have a div that is 100% wide and 100px high, how can I then run a function when the div is in the middle of the view? Or at the top, lets say 10 px below the navbar?
var wow = new WOW(
{
callback: function(box) {
// the callback is fired every time an animation is started
// the argument that is passed in is the DOM node being animated
}
}
);
wow.init();
and in your page content
<div class="wow">
Content to Reveal Here
</div>
its used to display animations when the div appear in the screen, bu change it to your needs.
i never use it with f7.
EDIT:
Just notice is deprecated you can use it.
butâŚ
JS Events
AOS dispatches two events on document: aos:in and aos:out whenever any element animates in or out, so that you can do extra stuff in JS:
Thanks, but I want to run a function when a div comes into the view, not an animation.
And I thought that framework7 had some function that checks that perhaps?
But I will use the âanimate on scrollâ script for other stuff though