(Created page with "var $nav_sidebar_content = $("#nav-sidebar-content"); var have_showed = false; var nav_top = document.getElementById("nav-top"); var nav_top_a = document.querySelector("#nav-t...") |
|||
Line 1: | Line 1: | ||
var $nav_sidebar_content = $("#nav-sidebar-content"); | var $nav_sidebar_content = $("#nav-sidebar-content"); | ||
+ | var $body = $('body'); | ||
var have_showed = false; | var have_showed = false; | ||
var nav_top = document.getElementById("nav-top"); | var nav_top = document.getElementById("nav-top"); | ||
Line 13: | Line 14: | ||
$(document).foundation(); | $(document).foundation(); | ||
− | var controller = new ScrollMagic.Controller(); | + | //var controller = new ScrollMagic.Controller(); |
− | + | /* | |
var tween1 = new TweenMax.from("#animation1", 0.7, { delay: 0.25, scale: 0.8, xPercent: -5, opacity: 0, ease: Power2.easeOut }); | var tween1 = new TweenMax.from("#animation1", 0.7, { delay: 0.25, scale: 0.8, xPercent: -5, opacity: 0, ease: Power2.easeOut }); | ||
var tween2 = new TweenMax.from("#text1", 0.7, { scale: 0.7, opacity: 0, xPercent: -5, ease: Power2.easeOut }); | var tween2 = new TweenMax.from("#text1", 0.7, { scale: 0.7, opacity: 0, xPercent: -5, ease: Power2.easeOut }); | ||
var tween3 = new TweenMax.from("#animation2", 0.7, { delay: 0.25, xPercent: -20, opacity: 0, ease: Power2.easeOut }); | var tween3 = new TweenMax.from("#animation2", 0.7, { delay: 0.25, xPercent: -20, opacity: 0, ease: Power2.easeOut }); | ||
var tween4 = new TweenMax.from("#text2", 0.7, { scale: 0.7, opacity: 0, ease: Power2.easeOut }); | var tween4 = new TweenMax.from("#text2", 0.7, { scale: 0.7, opacity: 0, ease: Power2.easeOut }); | ||
− | + | */ | |
− | + | ||
nav_top.onclick = function(e) { | nav_top.onclick = function(e) { | ||
e.preventDefault(); | e.preventDefault(); | ||
− | + | $body.stop(true).animate({ | |
+ | scrollTop: 0 | ||
+ | }, { | ||
+ | duration: 500, | ||
+ | easing: 'linear' | ||
+ | }); | ||
}; | }; | ||
− | + | /* | |
nav_top_a.onclick = function(e) { | nav_top_a.onclick = function(e) { | ||
e.preventDefault(); | e.preventDefault(); | ||
TweenMax.to(window, .5, { scrollTo: { y: 0 } }); | TweenMax.to(window, .5, { scrollTo: { y: 0 } }); | ||
}; | }; | ||
− | + | */ | |
+ | /* | ||
nav_link1.onclick = function(e) { | nav_link1.onclick = function(e) { | ||
e.preventDefault(); | e.preventDefault(); | ||
Line 53: | Line 59: | ||
TweenMax.to(window, .5, { scrollTo: { y: "#link5", offsetY: 30 } }); | TweenMax.to(window, .5, { scrollTo: { y: "#link5", offsetY: 30 } }); | ||
}; | }; | ||
− | + | */ | |
− | + | /* | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
new ScrollMagic.Scene({ triggerElement: "#text1", triggerHook: "0.4", reverse: false }) | new ScrollMagic.Scene({ triggerElement: "#text1", triggerHook: "0.4", reverse: false }) | ||
.setTween(tween1) | .setTween(tween1) | ||
Line 74: | Line 73: | ||
.setTween(tween4) | .setTween(tween4) | ||
.addTo(controller); | .addTo(controller); | ||
− | + | */ | |
$("figure#overlay").click(function() { | $("figure#overlay").click(function() { | ||
Line 109: | Line 108: | ||
− | + | /* | |
new ScrollMagic.Scene({ triggerElement: "#link1", triggerHook: "onLeave" }) | new ScrollMagic.Scene({ triggerElement: "#link1", triggerHook: "onLeave" }) | ||
.setClassToggle("#nav-sidebar", "nav-sidebar-toggle") | .setClassToggle("#nav-sidebar", "nav-sidebar-toggle") | ||
.addTo(controller); | .addTo(controller); |
Revision as of 10:08, 10 October 2016
var $nav_sidebar_content = $("#nav-sidebar-content"); var $body = $('body'); var have_showed = false; var nav_top = document.getElementById("nav-top"); var nav_top_a = document.querySelector("#nav-top a"); var nav_link1 = document.getElementById("nav-link1"); var nav_link2 = document.getElementById("nav-link2"); var nav_link3 = document.getElementById("nav-link3"); var nav_link4 = document.getElementById("nav-link4"); var nav_link5 = document.getElementById("nav-link5");
$(document).foundation();
//var controller = new ScrollMagic.Controller(); /* var tween1 = new TweenMax.from("#animation1", 0.7, { delay: 0.25, scale: 0.8, xPercent: -5, opacity: 0, ease: Power2.easeOut }); var tween2 = new TweenMax.from("#text1", 0.7, { scale: 0.7, opacity: 0, xPercent: -5, ease: Power2.easeOut }); var tween3 = new TweenMax.from("#animation2", 0.7, { delay: 0.25, xPercent: -20, opacity: 0, ease: Power2.easeOut }); var tween4 = new TweenMax.from("#text2", 0.7, { scale: 0.7, opacity: 0, ease: Power2.easeOut });
- /
nav_top.onclick = function(e) {
e.preventDefault(); $body.stop(true).animate({ scrollTop: 0 }, { duration: 500, easing: 'linear' });
}; /* nav_top_a.onclick = function(e) {
e.preventDefault(); TweenMax.to(window, .5, { scrollTo: { y: 0 } });
};
- /
/* nav_link1.onclick = function(e) {
e.preventDefault(); TweenMax.to(window, .5, { scrollTo: { y: "#link1", offsetY: 30 } });
}; nav_link2.onclick = function(e) {
e.preventDefault(); TweenMax.to(window, .5, { scrollTo: { y: "#link2", offsetY: 30 } });
}; nav_link3.onclick = function(e) {
e.preventDefault(); TweenMax.to(window, .5, { scrollTo: { y: "#link3", offsetY: 30 } });
}; nav_link4.onclick = function(e) {
e.preventDefault(); TweenMax.to(window, .5, { scrollTo: { y: "#link4", offsetY: 30 } });
}; nav_link5.onclick = function(e) {
e.preventDefault(); TweenMax.to(window, .5, { scrollTo: { y: "#link5", offsetY: 30 } });
};
- /
/* new ScrollMagic.Scene({ triggerElement: "#text1", triggerHook: "0.4", reverse: false })
.setTween(tween1) .addTo(controller);
new ScrollMagic.Scene({ triggerElement: "#text1", triggerHook: "0.4", reverse: false })
.setTween(tween2) .addTo(controller);
new ScrollMagic.Scene({ triggerElement: "#animation2", triggerHook: "0.4", reverse: false })
.setTween(tween3) .addTo(controller);
new ScrollMagic.Scene({ triggerElement: "#animation2", triggerHook: "0.4", reverse: false })
.setTween(tween4) .addTo(controller);
- /
$("figure#overlay").click(function() {
if (have_showed) { TweenMax.to("#nav-sidebar-content", 0.7, { x: 300 }); TweenMax.to("main", 0.7, { x: 0 }); TweenMax.to("#sticky-nav a", 0.7, { x: -150, ease: Power3.easeInOut }); TweenMax.to("figure", 0.7, { opacity: 0, visibility: "hidden" }); $("#nav-sidebar").toggleClass('open'); // $("body").toggleClass('disable-scroll'); have_showed = false; }
})
$("#nav-sidebar").click(function() {
if (!have_showed) { TweenMax.to("#nav-sidebar-content", 0.7, { x: -300, ease: Power3.easeInOut }); TweenMax.to("main", 0.7, { x: -150, ease: Power3.easeInOut }); TweenMax.to("#sticky-nav a", 0.7, { x: -150, ease: Power3.easeInOut }); TweenMax.to("figure", 0.7, { opacity: 1, visibility: "visible" }); $(this).toggleClass('open'); // $("body").toggleClass('disable-scroll'); have_showed = true; } else { TweenMax.to("#nav-sidebar-content", 0.7, { x: 0, ease: Power3.easeInOut }); TweenMax.to("main", 0.7, { x: 0, ease: Power3.easeInOut }); TweenMax.to("#sticky-nav a", 0.7, { x: 0, ease: Power3.easeInOut }); TweenMax.to("figure", 1.5, { opacity: 0, visibility: "hidden" }); $(this).toggleClass('open'); // $("body").toggleClass('disable-scroll'); have_showed = false; }
});
/*
new ScrollMagic.Scene({ triggerElement: "#link1", triggerHook: "onLeave" })
.setClassToggle("#nav-sidebar", "nav-sidebar-toggle") .addTo(controller);