$(document).ready(function() {
	tooltip();
	$('.thumb').livequery('click', function(event) { 
		loadImage($(this));
		return false;
	});							   
});
function loadImage(obj) {
	
	var loader = '<img id="loader" src="images/ajax-loader.gif" alt="Loading..." />';
	$('#imgHolder').fadeOut('fast', function() {  
		
		$('#imgHolder img').remove();
		$('.imgMain').append(loader);
		var img = new Image();
		 // wrap our new image in jQuery, then:
		$(img)
			// once the image has loaded, execute this code
			.load(function () {
			  $('#imgHolder').append(this);  
			  $('#loader').fadeOut('fast', function() { $('#loader').remove(); });
		})
		// if there was an error loading the image, react accordingly
		.error(function () { })
		.attr('src', $(obj).attr('href'));
		});
		$('#imgHolder').fadeIn('slow');
}
 
 
 /* Tooltip:  Thanks to Alen Grakalic (http://cssglobe.com) */
 this.tooltip = function(){	
	/* CONFIG */		
		xOffset = 10;
		yOffset = 20;		
		// these 2 variable determine popup's distance from the cursor
		// you might want to adjust to get the right result		
	/* END CONFIG */		
	$("a.tooltip").hover(function(e){											  
		this.t = this.title;
		this.title = "";									  
		$("body").append("<p id='tooltip'>"+ this.t +"</p>");
		//$("#tooltip").corner();
		$("#tooltip")
			.css("top",(e.pageY - xOffset) + "px")
			.css("left",(e.pageX + yOffset) + "px")
			.fadeIn("normal");		
    },
	function(){
		this.title = this.t;		
		$("#tooltip").remove();
    });	
	$("a.tooltip").mousemove(function(e){
		$("#tooltip")
			.css("top",(e.pageY - xOffset) + "px")
			.css("left",(e.pageX + yOffset) + "px");
	});			
};