Check when an element comes into view (jQuery)

check-if-element-in-viewport-on-scroll.js

function isOnScreen(elem) {
	// if the element doesn't exist, abort
	if( elem.length == 0 ) {
		return;
	}
	var $window = jQuery(window)
	var viewport_top = $window.scrollTop()
	var viewport_height = $window.height()
	var viewport_bottom = viewport_top + viewport_height
	var $elem = jQuery(elem)
	var top = $elem.offset().top
	var height = $elem.height()
	var bottom = top + height

	return (top >= viewport_top && top < viewport_bottom) ||
	(bottom > viewport_top && bottom <= viewport_bottom) ||
	(height > viewport_height && top <= viewport_top && bottom >= viewport_bottom)
}

jQuery( document ).ready( function() {
	window.addEventListener('scroll', function(e) {
		if( isOnScreen( jQuery( '.shipping-logos' ) ) ) { /* Pass element id/class you want to check */
			alert( 'The specified container is in view.' );
 		}	
	});
});

great work!
Although with
var top = $elem.offset().top
im getting an error!
I changed it to:
var top = $elem[0].offsetTop;
and it works perfectly now!

Is it possible to track where the element is in the viewport?

Thanks!

why it works for one element only?

Awesome

cant make it work for multiple elements with same class with .each()