If you only need to fire once:
$(window).scroll(function(){
// This is then function used to detect if the element is scrolled into view
function elementScrolled(elem)
{
var docViewTop = $(window).scrollTop();
var docViewBottom = docViewTop + $(window).height();
var elemTop = $(elem).offset().top;
return ((elemTop <= docViewBottom) && (elemTop >= docViewTop));
}
// This is where we use the function to detect if ".box2" is scrolled into view, and when it is add the class ".animated" to the child element
if(elementScrolled('. box2')) {
// Your function here
}
});
Full answer: https://www.thewebtaylor.com/articles/how-to-detect-if-an-element-is-scrolled-into-view-using-jquery
