var navArrowSlider = function(navWrap, navElementsArray, activeID, arrowY, leftOffset) {
    var youAreHere = new Fx.Tween($(navWrap), {
        duration: 500,
        transition: Fx.Transitions.Bounce.easeOut
    });

    $$(navElementsArray).each(function(item) {
        item.addEvent('mouseenter', function() {
            //var thisPos = item.getPosition(navWrap).x  + item.getSize().x - leftOffset;
            var thisPos = item.getPosition(navWrap).x + item.getSize().x - item.getSize().x - 5;
            youAreHere.cancel();
            youAreHere.start('background-position', thisPos + 'px ' + arrowY + 'px');
        });
    });

    var currentArrow = function() {
        youAreHere.cancel();
        if ($(activeID != null)) {
            var activePos = $(activeID).getPosition(navWrap).x + $(activeID).getSize().x - $(activeID).getSize().x - 5;
            youAreHere.start('background-position', activePos + 'px ' + arrowY + 'px');
        }
        else {
            youAreHere.start('background-position', '0px 0px');
        }
    };

    //correct IE rendering problem (without this, it wont go to the active nav onload)
    if ($(activeID != null)) {
        var activePos = $(activeID).getPosition(navWrap).x + $(activeID).getSize().x - $(activeID).getSize().x - 5;
        $(navWrap).setStyle('background-position', activePos + 'px ' + arrowY + 'px');
    }
    else {
        $(navWrap).setStyle('background-position', '0px 0px');
    }

    //works to set image to starting position in other browsers
    currentArrow();

    $(navWrap).addEvent('mouseleave', currentArrow);
}; 

/*
window.addEvent('domready', function() {
	navArrowSlider(
		'navigation', // ID of nav wrap
		'#navigation ul li', // Array selector of nav elements 
		'homenav', // ID of current nav element
		'0', //  Background position y of background image
		'0' //  INT ONLY - How far left from the right edge of the nav element that the image settles
	);
});
*/
