// Creates new jQuery function
(function($){
	$.fn.flippyfloppy = function(type, url) {
		this.each(function() {
			var self = this;
			var t = type;
			var info = $(this).attr('rel');
			var explode = info.split('-');
			var name = explode[0];
			var url2 = url;
			
			
				
				var width2 = explode[1] / 2;
				var height = explode[2];
				
				// Adds the basic style to the <a>
				$(self).css({
						'height': height,
						'width': width2,
						'display': 'inline-block',
						'background': 'url('+url2+'/images/'+name+'.'+t+')'
					});
					
				// Assigns custom class
				$(self).addClass('roll-'+name);
					
				// Creats the flippy floppy effect
				$('.roll-'+name).hover(function(){
					$(self).css('background-position', '-'+width2+'px 0');
				}, function(){
					$(self).css('background-position', '');
				});
	
			
						
			// Leaves the text for SEO but removes the text
			$(this).children('span').css({
				'display': 'block',
				'text-indent': '-9999px',
				'position': 'absolute'
			});
				
		});

	return this;
	};
}(jQuery));