RandolphLiu (Talk | contribs) (fix the animation queue bug) |
|||
Line 21: | Line 21: | ||
var next_iter = iter+1; | var next_iter = iter+1; | ||
} | } | ||
− | $('#banner-pic-'+next_iter).fadeIn(1000); | + | $('#banner-pic-'+next_iter).clearQueue().fadeIn(1000); |
− | $('#banner-pic-'+iter).delay(500).fadeOut(1000); | + | $('#banner-pic-'+iter).clearQueue().delay(500).fadeOut(1000); |
iter = next_iter; | iter = next_iter; | ||
}, 6000) | }, 6000) |
Revision as of 22:16, 15 October 2018
$(document).ready(function(){
// banner text showing animation $('#text-d').animate({opacity: '1'}, 800, 'swing'); $('#text-e').delay(800).animate({opacity: '1'}, 800, 'swing'); $('#text-cose').delay(1600).animate({opacity: '1'}, 1000, 'swing'); $('.banner-sub-text').delay(3000).animate({opacity: '1'}, 800, 'swing'); $('.banner-up-arrow').delay(4000).animate({opacity: '1'}, 800, 'swing');
// banner scroll hint animation setInterval(function(){ $('.banner-up-arrow').clearQueue().fadeTo(1400, 0.4).fadeTo(1400, 0.8); }, 2800); var iter=1;
// banner picture cycling animation setInterval(function(){ if (iter == $('.banner-pic-wrapper').children().length-1) { var next_iter = 1; } else { var next_iter = iter+1; } $('#banner-pic-'+next_iter).clearQueue().fadeIn(1000); $('#banner-pic-'+iter).clearQueue().delay(500).fadeOut(1000); iter = next_iter; }, 6000)
// content text showing animation $('.content-title').waypoint(function(){ $(this.element).animate({top: '0', opacity: '1'}, 800, 'swing'); }, {offset: '70%'}); $('.content-text:not(#content-block-2 .content-text)').waypoint(function(){ $(this.element).animate({left: '0', opacity: '1'}, 600, 'swing'); }, {offset: '70%'}); $('#content-block-2 .content-text').waypoint(function(){ $(this.element).animate({left: '0', opacity: '1'}, 600, 'swing'); }, {offset: '70%'});
// team picture $("#content-block-4").waypoint(function() { if ($("#content-block-4").data('inview') != 'true') { $('.banner-pic-wrapper').hide(); $('#content-block-4-pic').show(); $("#content-block-4").data('inview', 'true'); } else { $('.banner-pic-wrapper').show(); $('#content-block-4-pic').hide(); $("#content-block-4").data('inview', 'false'); } }, {offset: 'bottom-in-view'});
});