Created
January 20, 2013 07:39
-
-
Save goyalankit/4577174 to your computer and use it in GitHub Desktop.
javascript for lab page
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
$(document).ready(function(){ | |
//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:'-260px'},{queue:false,duration:300}); | |
}, function() { | |
$(".cover", this).stop().animate({top:'0px'},{queue:false,duration:300}); | |
}); | |
//Horizontal Sliding | |
$('.boxgrid.slideright').hover(function(){ | |
$(".cover", this).stop().animate({left:'325px'},{queue:false,duration:300}); | |
}, function() { | |
$(".cover", this).stop().animate({left:'0px'},{queue:false,duration:300}); | |
}); | |
//Diagnal Sliding | |
$('.boxgrid.thecombo').hover(function(){ | |
$(".cover", this).stop().animate({top:'260px', 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}); | |
}); | |
//Full Caption Sliding (Hidden to Visible) | |
$('.boxgrid.captionfull').hover(function(){ | |
$(".cover", this).stop().animate({top:'160px'},{queue:false,duration:160}); | |
}, function() { | |
$(".cover", this).stop().animate({top:'260px'},{queue:false,duration:160}); | |
}); | |
//Caption Sliding (Partially Hidden to Visible) | |
$('.boxgrid.caption').hover(function(){ | |
$(".cover", this).stop().animate({top:'160px'},{queue:false,duration:160}); | |
}, function() { | |
$(".cover", this).stop().animate({top:'220px'},{queue:false,duration:160}); | |
}); | |
}); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment