// JavaScript Document
$(window).load(function(){
	var thumbnail = {
		imgIncrease : 30, /* the image increase in pixels (for zoom) */
		effectDuration : 200, /* the duration of the effect (zoom and caption) */
		imgWidth : $('.thumbnailWrapper ul li').find('img').width(), 
		imgHeight : $('.thumbnailWrapper ul li').find('img').height() 
	};
	$('.thumbnailWrapper ul li').css({ 
		
		'width' : thumbnail.imgWidth, 
		'height' : thumbnail.imgHeight 
		
	});
	$('.thumbnailWrapper ul li').hover(function(){
		$(this).find('img').stop().animate({
			width: parseInt(thumbnail.imgWidth) + thumbnail.imgIncrease,
			left: thumbnail.imgIncrease/2*(0),
			top: thumbnail.imgIncrease/2*(-1)
		},{ 
			"duration": thumbnail.effectDuration,
			"queue": false
		});
		$(this).find('.caption:not(:animated)').slideDown(thumbnail.effectDuration);
	}, function(){
		$(this).find('img').animate({
			width: thumbnail.imgWidth,
			left: 0,
			top: 0
		}, thumbnail.effectDuration);
		$(this).find('.caption').slideUp(thumbnail.effectDuration);
	});
});
