﻿function makeHorizontalScroll( wrapper, imagesContainer ){

	//Get our elements for faster access and set overlay width
	var div = JQ(wrapper),
		ul = JQ(imagesContainer),
		ulPadding = 1;

	//Get menu width
	var divWidth = div.width();

	//Remove scrollbars	
	div.css({overflow: 'hidden'});
	
	//Find last image container
	var lastLi = ul.find('li:last-child');	
	//When user move mouse over menu
	div.mousemove(function(e){	
	    var inactiveMargin = 50; 	    
		//As images are loaded ul width increases,
		//so we recalculate it each time
		var ulWidth = lastLi[0].offsetLeft + lastLi.outerWidth() + ulPadding + inactiveMargin;				
		var left = (e.pageX - div.offset().left) * (ulWidth-divWidth) / divWidth - inactiveMargin;
		if (left < 0) 
		    left = 0;
		div.scrollLeft(left);
	});
}
