(function($){
			
	$.fn.imageMenu = function(p){
		
		//
		//HTML REQUIREMENTS
		//
		/*
		<div> -> main div
			<div iM="slide"> -> slider container div
				<img iM="slider" /> -> menu image
			</div>
			.
			.
			.
			<div iM="slide"> -> slider container div
				<img iM="slider" /> -> menu image
			</div>
			.
			.
			.
		</div>
		*/
		//
		//USER DEFAULT PARAMETERS
		//
		/*
		speed: 250 (effects duration)
		activeMenu: 0 (item activated on launch, 1 to n to highlight an item from the start)
		type: "roll" (types of animation : 'roll', 'opacity')
		launchingSequence: false (building with animation)
		launchingSequenceSpeed: 125 (duration of building sequence for one item)
		rollAnimVar: 12 (variable for roll type in pixels, depending of your images files height between activeMenu and inactiveMenu type)
		opacityAnimVar: 0.5 (variable for opacity type from 0 to 1, set the inactiveMenu state opacity)
		*/
		
		
		//
		//settings
		//
		var p = $.extend({//user parameters
			speed: 250,
			activeMenu: 0,
			type: "roll",
			launchingSequence: false,
			launchingSequenceSpeed: 125,
			rollAnimVar: 12,
			opacityAnimVar: 0.5
		},p);
		
		p.activeMenu--; //to avoid starting from 0.
		
		var p = $.extend({//calculated parameters
			previous: p.activeMenu
		},p);
		
		switch(p.type) {//storing anim inactiveMenu params for multiple use (function / lauching sequence queue)
			case "roll" : var AIP = $.extend({ bottom: 0 }, AIP); break;
			case "opacity" : var AIP = $.extend({ opacity: p.opacityAnimVar }, AIP); break;
		}
		
		
		//
		//change state functions
		//
		function animactiveMenu(jElem, q) {  
			
			var q = (q == null) ? false : q;

			switch(p.type) {
				case "roll" : jElem.animate({bottom: p.rollAnimVar}, p.speed); break;	
				case "opacity" : jElem.animate({opacity: 1}, p.speed); break;
			}
		
		};
		
		function animInactiveMenu(jElem, q) { 
		
			var q = (q == null) ? false : q;
			
			switch(p.type) {
				case "roll" : jElem.animate(AIP, p.speed);  break;	
				case "opacity" : jElem.animate(AIP, p.speed); break;
			}
		
		};
		
		function activeMenu(jElem) {  
			switch(p.type) {
				case "roll" : jElem.css("bottom", p.rollAnimVar); break;	
				case "opacity" : jElem.css("opacity", 1); break;
			}
		};
		
		function inactiveMenu(jElem) {  
			switch(p.type) {
				case "roll" : jElem.css("bottom", 0); break;	
				case "opacity" : jElem.css("opacity", p.opacityAnimVar); break;
			}
		};
		
		
		//
		//assigning this to a var
		//
		var mainDiv = this;
		
		
		//
		//launching sequence
		//
		if(p.launchingSequence) {
			
			mainDiv.children("div[@iM=slide]").children("img[@iM=slider]").each(function () {
				activeMenu($(this));
			});
			
			var fxQueue = [];
			
			mainDiv.children("div[@iM=slide]").children("img[@iM=slider]").each(function (i) {
				
				if(i != p.activeMenu) {

					fxQueue.push({s: this, p: [AIP, p.speed/2]});
				
				}
			
			});

			$.fxQueue.start(fxQueue);
			
		}
		
		
		//
		//behaviors assigning
		//
		return mainDiv.children("div[@iM=slide]").each(
			
			function(i){
				
				var cSlider = $(this).children("img[@iM=slider]");
				
				if(i != p.activeMenu && p.launchingSequence == false) {
					inactiveMenu(cSlider);
				}else{
					activeMenu(cSlider);
				}
				
				$(this).click(
					
					function(){
						
						if(i != p.activeMenu) {
							p.previous = p.activeMenu;
							p.activeMenu = i;
						}
						
						activeMenu(cSlider);
						animInactiveMenu(mainDiv.children("div[@iM=slide]").eq(p.previous).children("img[@iM=slider]"));
	
						return false;
					
					}
				
				);	
				
				$(this).hover(
					function(){ if(i != p.activeMenu) {animactiveMenu(cSlider);} },
					function(){	if(i != p.activeMenu) {animInactiveMenu(cSlider);} }
				);
			
			}
		
		);

	};

})(jQuery)