$(function(){
		/* thumbnails opacity hover ---------------------------*/		
		$('.thumbnails li').hover(
			function () {
				$(this).css({'opacity': .4 });
			},
			function () {
				$(this).css({'opacity': 1 });
			  }
			);
			
		/*  handle thumbnail click to show large image ------------------------*/
		$('.thumbnails img').click(function() {
			$('#holder').empty().addClass('loading'); 
			var t = $(this).attr('title');
			var imgfile =  'images/art/' + $(this).parent().attr('href');
			var alt = $(this).attr('alt');
				
			/* 
			this pre-loader code comes from 
			http://jqueryfordesigners.com/image-loading/
			*/
			var img = new Image();
			$(img).load(function () {
				$(this).hide();
				$('#holder').empty().removeClass('loading').append(this); 
				$(this).fadeIn();
			}).error(function () {
					alert('Sorry, this image could not be loaded'); 
			}).attr({
				'src':imgfile, 
				'alt':alt
				});
			
			//changing the html of the caption to the title attr of thumbnails img
			$('.paintings .caption').html(t);
			return false;
		});
});