Animate element with jQuery

animation.js

/*

# Usage for your Javascript

$(document).ready(function(){
	
	var animate_squared = new animation({
		obj:  '#your-tag .item',
	});

	animate_squared.init();
	animate_squared.fadein();

});

# Usage for your CSS 
Eg: animation.scss

._fadein {
	@for $i from 1 through 5 {
		&:nth-of-type(#{$i}){
			@include transition( 600ms ease opacity $i * 350ms , 600ms ease transform $i * 400ms );
			
		}
	}
	
	@include transform( translateY(1rem));
	opacity:0;
	&.on { 
		@include transform( translateY(0));
		opacity:1; 
	}
}

*/

var animation = function(options){

	this.options = options;
	
	this.init = function(){
		var _self = this;
	}

	// Shared functions
	this.misc = {

		// Check if element is visible from top
		is_visible: function( _win, _obj){
			var top_of_object = _obj.offset().top;
			var bottom_of_window = _win.scrollTop() + _win.height();

			if( bottom_of_window > top_of_object ){
				return true;
				
			} else { return false; }
		}
	}

	// Fade in element
	this.fadein = function(){
		_self = this;
		
		$(options.obj).addClass('_fadein');
		
		var _win = $(window);
		$(window).on('load scroll', function(){

			$('._fadein').each(function(){
				
				if( _self.misc.is_visible(_win, $(this) ) ){
					$(_self.options.obj).addClass('on');

				} else {
					$(_self.options.obj).removeClass('on');
				}

			});

		});

			
	}
}