function makeScrollable(wrapper, scrollable){
	var wrapper = $(wrapper), scrollable = $(scrollable);
	scrollable.hide();
	var loading = $('<div class="loading">Loading content...</div>').appendTo(wrapper);
	var interval = setInterval(function(){
		var images = scrollable.find('img');
		var completed = 0;
		images.each(function(){
			if (this.complete) completed++;	
		});
		
		if (completed == images.length){
			clearInterval(interval);
			setTimeout(function(){
				loading.hide();
				wrapper.css({overflow: 'hidden'});						
				scrollable.slideDown('slow', function(){
					enable();	
				});					
			}, 1000);	
		}
	}, 100);
	
	function enable(){			
		var wrapperWidth = wrapper.width();
		var wrapperHeight = wrapper.height();
		var scrollableHeight = scrollable.outerHeight();
		var lastTarget;
		wrapper.mousemove(function(e){
			lastTarget = e.target;
			var wrapperOffset = wrapper.offset();
			var top = (e.pageY -  wrapperOffset.top) * (scrollableHeight - wrapperHeight) / wrapperHeight;
			wrapper.scrollTop(top);
		});
		

		
}
}

$(function(){
	//Get our elements for faster access and set overlay width
	var div = $('div.flowvertcont'),
		ul = $('ul.flowvertcont'),
		ulPadding = 15;
	
	//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){
		//As images are loaded ul width increases,
		//so we recalculate it each time
		var ulWidth = lastLi[0].offsetLeft + lastLi.outerWidth() + ulPadding;	
		var left = (e.pageX - div.offset().left) * (ulWidth-divWidth) / divWidth;
		div.scrollLeft(left);
	});
});