// Menu image rollovers using jQuery v1.5 on 3/5/2011
$(document).ready(function() {
	// all menu images require id='m-3', etc. starting with 'm-0'
	// user defined
	var skip		= 2, // Use '2' for 1 image between each menu item, 12, 14, 16, etc.
		path		= '/graphics_slices/main/WebsiteSetup_', //path incl. filename prefix
		start		= 12, // starting menu image id number
		sticky		= '-sticky', // suffix for sticky item
		over		= '-over',  // suffix for hover item
		type		= '.jpg', // .jpg, .gif, .png, etc.
	// end user defined
		section		= $('input#section').attr('value'), // this is value of hidden field id='section'
		j;
	
	$('img[id|="m"]').each(function (i) {
		imgid = ((i*skip) + start); if (imgid < 10){imgid="0"+imgid};
		if (section == i){
			$(this).attr({ src: path+imgid+sticky+type });
			$(this).click(function (e) { e.preventDefault(); }).css("cursor","default"); // kills link cuz you're already there
		} else {
			$(this).attr({ src: path+imgid+over+type }).css({ opacity: 0 });
		};
		// preloads all hidden menu images on page load
		(new Image()).src	=	path+imgid+over+type; 
		(new Image()).src	=	path+imgid+sticky+type;
	});
	
	// for fade animation, must set 'normal' image as DIV background image in CSS
	function enter() { // mouse enter
		j = $(this).attr('id').replace(/m-/, "");
		if (section != j){$(this).animate({opacity:1},300);};
	};
	function leave() { // mouse leave
		j = $(this).attr('id').replace(/m-/, "");
		if (section != j){$(this).animate({opacity:0},750);};
	};
	
	$('img[id|="m"]').hover(enter, leave).click(leave); // 'click(leave)' fixes back-button issues
	
});