Skip to content

Instantly share code, notes, and snippets.

@captDaylight
Created June 24, 2013 14:09
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save captDaylight/5850314 to your computer and use it in GitHub Desktop.
Save captDaylight/5850314 to your computer and use it in GitHub Desktop.
Landing page animation
MADPRESS.Index = {
init: function(data, callback) {
},
index: function(data, callback) {
// FIRST SLIDE ANIMATION /////////////////////////
var animateFinal = function(){
$('#blue-ball').animate({
'height': '3000px',
'width' : '3000px',
'left': -900,
'top': -1000
},2000,'swing');
$('.feature-bars').animate({
'left':'1200px',
'top':'1200px',
'width': 890,
'height': 382,
},2000);
$('#blue-ball h1').show().animate({
'top': 1200,
'left':900
},2000,'swing');
$('#slide-one-link').animate({
'left':0
},2250);
}
var copy = $('.feat-one-copy');
$(copy[0]).animate({'top':'200px'},600,'easeOutQuint',function(){
//copy
$(copy[1]).animate({'top':'200px'},700,'easeOutQuint',function(){
//copy2
$(copy[2]).animate({'top':'200px'},800,'easeOutQuint',function(){
$('#blue-ball').animate({
'height':50,
'width':50,
'top':220,
'left':600},1500,'easeOutBounce',function(){
});
$('.feature-bars').animate({
'left':'2px',
'top':'14px',
'width': 45,
'height': 19,
},1500,function(){
$('.feature-bars').animate({
'opacity':1
},200);
var timeoutID = window.setTimeout(animateFinal, 600);
});
});
});
});
// TOGGLE THROUGH SLIDES ///////////////
$('.square-selector').click(function(){
var id = $(this).attr('id');
if(!$(this).hasClass('selected')){
// the select is not already selected
// switch out the info
$('.feature-item-info').hide();
$('#info-'+ id).fadeIn();
// switch out the feature
$('.feature-item').hide();
$('#feature-'+ id).fadeIn();
//remove selected from the other selectors and add it to this
$('.square-selector').removeClass('selected');
$(this).addClass('selected');
}
});
// FINAL SLIDE ANIMATION ////////////////
function changeImage(){
var test = false;
$('#feature-four .break-container img').each(function(){
if(test){
$(this).fadeIn(200);
test = false;
}else if($(this).is(':visible')){
$(this).hide();
test = true;
}
});
if(test === true){
$($('#feature-four .break-container img')[0]).show();
}
}
function changeCherry(){
$($('#feature-one .break-container img')[0]).hide();
$($('#feature-one .break-container img')[1]).fadeIn();
}
window.setInterval(changeImage,2000);
window.setInterval(changeCherry,4000);
}
};
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment