$(function(){

	var featureUL = $("#feature"),
		featureLinks = $("#feature li a");
	featureUL.append('<span class="f-highlighted">selected</span>');
	
	var slider = $('#feature .f-highlighted'),
		centerImage = featureUL.find('li:eq(2)');	
		
	
	var getRealLeft = function(elem){
		var e = elem;
		var l = e.position().left;
		var w = e.outerWidth();
		var mw = e.outerWidth(true);
		
		var realLeft = parseInt(l) + (mw - w);
		return realLeft;
	};
	
	slider.css({top: (centerImage.height() + 32), left: getRealLeft(centerImage)});

	$("#f-img li").bind('mouseenter', function(){
		var that = $(this),
			thatLink = that.children('a');
		
		featureLinks.removeClass('current');
		
		var curBgPos = thatLink.css('backgroundPosition');
		//curBgPos.replace(/\s0px/i, '-240px');
		thatLink.addClass('current');//.css('backgroundPosition', curBgPos);
		
		slider
			.stop(true)
			.animate({ left: getRealLeft(that) }, 350, 'swing');
		
		return false;
	});

});
