// JavaScript Document
$(document).ready(function(){


function cambiaclassi(div,h){

			if(h == 0){

					$(div).removeClass('img'+$(div).attr('id'));					
					$(div).addClass('img'+$(div).attr('id')+'h');
					
					$(div).find('h1').fadeOut("fast");
			}
			
			else{
				
					$(div).removeClass('img'+$(div).attr('id')+'h');					
					$(div).addClass('img'+$(div).attr('id'));
					
					$(div).find('h1').fadeIn();
			}
				
			
	
}
	
	
	

	//Full Caption Sliding (Hidden to Visible)
				$('.boxgrid.captionfull').hover(function(){
					
					$(".cover", this).stop().animate({top:'0px'},{queue:false,duration:300});
					cambiaclassi(this,0);
					
				}, function() {
					
					$(".cover", this).stop().animate({top:'325px'},{queue:false,duration:160});
					cambiaclassi(this,1);
					
					
				});
				
				
				$('.boxgrid.captionfullbottom').hover(function(){
					$(".cover", this).stop().animate({top:'0px'},{queue:false,duration:300});
					cambiaclassi(this,0);
								
					
				}, function() {
					$(".cover", this).stop().animate({top:'-325px'},{queue:false,duration:300});
					cambiaclassi(this,1);
				});
				
				
				
				
				
				
				
				
				
				
					//Horizontal Sliding
				$('.boxgrid.slideright').hover(function(){
					$(".cover", this).stop().animate({left:'0px'},{queue:false,duration:300});
				}, function() {
					$(".cover", this).stop().animate({left:'325px'},{queue:false,duration:300});
				});
				
					//Horizontal Sliding
				$('.boxgrid.slideleft').hover(function(){
					$(".cover", this).stop().animate({left:'0px'},{queue:false,duration:300});
				}, function() {
					$(".cover", this).stop().animate({left:'-325px'},{queue:false,duration:300});
				});
				
				
				
				
				



				//To switch directions up/down and left/right just place a "-" in front of the top/left attribute
				//Vertical Sliding
				$('.boxgrid.slidedown').hover(function(){
					$(".cover", this).stop().animate({top:'-250px'},{queue:false,duration:300});
				}, function() {
					$(".cover", this).stop().animate({top:'0px'},{queue:false,duration:300});
				});
				
				
			
				
				
				//Diagnal Sliding
				$('.boxgrid.thecombo').hover(function(){
					$(".cover", this).stop().animate({top:'250px', left:'325px'},{queue:false,duration:300});
				}, function() {
					$(".cover", this).stop().animate({top:'0px', left:'0px'},{queue:false,duration:300});
				});
				
				
				//Partial Sliding (Only show some of background)
				$('.boxgrid.peek').hover(function(){
					$(".cover", this).stop().animate({top:'90px'},{queue:false,duration:160});
				}, function() {
					$(".cover", this).stop().animate({top:'0px'},{queue:false,duration:160});
				});
				
			
				//Caption Sliding (Partially Hidden to Visible)
				$('.boxgrid.caption').hover(function(){
					$(".cover", this).stop().animate({top:'0px','position':'absolute','z-index':'1000'},{queue:false,duration:160});
				}, function() {
					$(".cover", this).stop().animate({top:'250px'},{queue:false,duration:160});
				});
			});