(function($){
	$.fn.sittiSlideBg = function(params) {
		var defaults = {
			speedIn         : 500,
			speedOut        : 700,
			easingIn        : 'swing',
			easingOut       : 'swing',
			foregroundClass : 'ssb-fg',
			backgroundClass : 'ssb-bg',
			backgroundCss   : {
				'position'         : 'relative',
				'z-index'          : 50,
				'background-color' : '#FFF',
				'opacity'          : 0.5
			},
			foregroundCss   : {
				'position' : 'relative',
				'z-index'  : 100
			},
			onHoverIn : function(item){},
			onHoverOut : function(item){},
			onInit : function(item){}
		};
		
		params = $.extend(true, defaults, params);
		
		$(this).each(function(){
		
			var item = $(this);
			item.html('<div class="' + params.foregroundClass + '">' + item.html() + '</div><div class="' + params.backgroundClass + '"></div>');
			
			$('.' + params.foregroundClass, item).css(params.foregroundCss);
			
			var bgCss = $.extend(params.backgroundCss, {
				width   : item.width(),
				top     : -1,
				height  : 1,
				display : 'none'
			});
			$('.' + params.backgroundClass, item).css(bgCss);
			
			item.hover(
				function(){				
					$('.' + params.backgroundClass, item).stop(false,true).show().animate({
						top    : -1 * item.height(),
						height : item.height()
					}, params.speedIn, params.easingIn, function(){params.onHoverIn(item);});
					
				}, 
				function(){
					params.onHoverOut(item);
					$('.' + params.backgroundClass, item).stop(false,true).animate({
						top    : -1,
						height : 1
					}, params.speedOut, params.easingOut, function(){
						$(this).hide();
					});
				}
			);
			
			params.onInit(item);
		});
	}
})(jQuery);
