
var navArrowSlider = function(navWrap, navElementsArray, activeID, arrowY, leftOffset) {

	var youAreHere = new Fx.Tween($(navWrap), { 

		duration: 900,

		transition: Fx.Transitions.Circ.easeOut  

	});

	$$(navElementsArray).each(function(item){  

		item.addEvent('mouseenter', function() { 

			var thisPos = item.getPosition(navWrap).x  + item.getSize().x - leftOffset; 

			youAreHere.cancel();

			youAreHere.start('background-position', thisPos + 'px ' + arrowY + 'px'); 

		});

	});

	var currentArrow = function() {

		youAreHere.cancel();

		var activePos = $(activeID).getPosition(navWrap).x  + $(activeID).getSize().x - leftOffset; 

		youAreHere.start('background-position', activePos + 'px ' + arrowY + 'px');      

	};

	

	//correct IE rendering problem (without this, it wont go to the active nav onload)

	var activePos = $(activeID).getPosition(navWrap).x  + $(activeID).getSize().x - leftOffset; 

	$(navWrap).setStyle('background-position', activePos + 'px ' + arrowY + 'px');       

	

	//works to set image to starting position in other browsers

	currentArrow(); 

	

	$(navWrap).addEvent('mouseleave', currentArrow);	

}; 

window.addEvent('domready', function() {

	navArrowSlider(

		'nav_wrap', // ID of nav wrap

		'#nav_wrap ul li', // Array selector of nav elements 

		'active_nav', // ID of current nav element

		'0', //  Background position y of background image

		'75' //  INT ONLY - How far left from the right edge of the nav element that the image settles

	); 	

}); 