Skip to content

Instantly share code, notes, and snippets.

@eccentricpixel
Created April 16, 2014 08:54
Show Gist options
  • Save eccentricpixel/10836052 to your computer and use it in GitHub Desktop.
Save eccentricpixel/10836052 to your computer and use it in GitHub Desktop.
Add page animations prior to following a link. Here it is setup for the main navigation, using GSAP for animation.
function closePage(href) {
var pageSwitching = new TimelineMax({ paused: true});
pageSwitching.insert(TweenLite.to($('#contentShell'), 1.25, {css:{ autoAlpha: 0, top: 1400 }, ease: Expo.easeInOut}), .1);
pageSwitching.insert(TweenLite.to('#top_bg', 1, {css:{autoAlpha:0, top:-900}, ease: Expo.easeInOut}), 0.15);
pageSwitching.play();
setTimeout(function() {
gotoPage(href);
}, 750);
}
function initButtons() {
$('#main_menu a').click(function(){
var href = this.href;
if ($(this).attr('target') == '_blank') {
gotoPage();
} else {
closePage(href);
}
return false;
});
}
function gotoPage(href){
window.location = href;
}
initButtons();
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment