$(function (){	
	//show first image
	var imageLink = $(".items a").attr("href"); //Find Image Name
	var img = $(".mainImage").html('<img src="'+imageLink+'" alt="" />' );
	//show content
	var title1 = $(".title1").html();
	var dsc1 = $(".dsc1").html();
	$("#box1 h2").html(title1);
	$("#box1 .content").html(dsc1);
	
	var title2 = $(".title2").html();
	var dsc2 = $(".dsc2").html();
	$("#box2 h2").html(title2);
	$("#box2 .content").html(dsc2);
	
	//on click function
	$(".items").click(function() {		
		//show images on click
		var imageLink = $("a",this).attr("href"); //Find Image Name
		//var img = $(".mainImage img").attr({ src: imageLink });
		var img = $(".mainImage").html('<img src="'+imageLink+'" alt="" />' );
		$(img).hide();
		$(img,this).fadeIn(1000);
		//$(img).slideDown("fast");
		
		//show content on click
		var title1 = $(".title1",this).html();
		var dsc1 = $(".dsc1",this).html();
		$("#box1 h2").html(title1);
		$("#box1 .content").html(dsc1);
		
		var title2 = $(".title2",this).html();
		var dsc2 = $(".dsc2",this).html();
		$("#box2 h2").html(title2);
		$("#box2 .content").html(dsc2);
		$('.items img').removeClass('active');
		$('img',this).addClass('active');
		
		//image title
		var imgTitle = $('.imgTitle',this).html();
		$('h1').html(imgTitle);

		return false;		
	}); 

});



//mouser hover function
/*$(function() {
	$('.items img').stop().animate ({ opacity: 1.0 });
	$('.items:first img').addClass('active');

    $('.items img').each(function() {
        $(this).hover(function() {
            $(this).stop().animate({ opacity: 1.0 }, 500);
        },
       function() {
           $(this).stop().animate({ opacity: 1.0 }, 500);
       });
    });
});*/