just use one method

This commit is contained in:
Brittany Chiang
2016-12-27 19:08:14 -05:00
parent f14f2865d9
commit c156e3e427
4 changed files with 41 additions and 56 deletions

View File

@@ -43,51 +43,33 @@ $(function() {
});
// hide dot nav if we are on the intro section
const dotNav = document.querySelector('#dot-nav');
const about = document.querySelector('#about-section');
function handleDotNav() {
const isDesktop = window.innerWidth > 768;
const topOfAbout = about.offsetTop - (about.offsetTop / 4);
const isBelowIntro = window.scrollY > topOfAbout;
if (isDesktop && isBelowIntro) {
dotNav.classList.add('active');
} else {
dotNav.classList.remove('active');
}
}
window.addEventListener('scroll', handleDotNav);
// hide or show hamburger menu depending on window width
const hamburger = document.querySelector('#toggle');
const overlay = document.querySelector('#overlay');
function switchNavs() {
function handleNavs() {
const isDesktop = window.innerWidth > 768;
const topOfAbout = about.offsetTop - (about.offsetTop / 4);
const isBelowIntro = window.scrollY > topOfAbout;
const menuOpen = overlay.classList.contains('open');
if (isDesktop) {
if (isDesktop && isBelowIntro) {
dotNav.classList.add('active');
if (menuOpen) {
hamburger.classList.remove('active');
overlay.classList.remove('open');
}
} else if (isDesktop && menuOpen) {
toggleMenu();
} else {
dotNav.classList.remove('active');
}
}
window.addEventListener('resize', switchNavs);
window.addEventListener('scroll', handleNavs);
window.addEventListener('resize', handleNavs);
// Toggle mobile menu open and closed
function toggleMenu() {
this.classList.toggle('active');
hamburger.classList.toggle('active');
overlay.classList.toggle('open');
document.body.classList.toggle('noScroll');
}

View File

@@ -59,7 +59,8 @@
visibility: hidden;
overflow: hidden;
z-index: 10;
transition: 0.3s;
transition: all 0.3s ease;
@include MQ(M) {
&.open {
height: 100%;
z-index: 10;
@@ -89,6 +90,8 @@
}
}
}
}
.logo {
color: $white;
font-family: $Chronicle, $serif-stack;

View File

File diff suppressed because one or more lines are too long

View File

@@ -1 +1 @@
"use strict";function handleDotNav(){var t=window.innerWidth>768,e=about.offsetTop-about.offsetTop/4,n=window.scrollY>e;t&&n?dotNav.classList.add("active"):dotNav.classList.remove("active")}function switchNavs(){var t=window.innerWidth>768,e=overlay.classList.contains("open");t?(dotNav.classList.add("active"),e&&(hamburger.classList.remove("active"),overlay.classList.remove("open"))):dotNav.classList.remove("active")}function toggleMenu(){this.classList.toggle("active"),overlay.classList.toggle("open"),document.body.classList.toggle("noScroll")}function focusInput(){this.parentElement.classList.add("is-active","is-completed")}function blurInput(){this.parentElement.classList.remove("is-active","is-completed")}function autoExpand(){textarea.style.height="",textarea.style.height=Math.min(textarea.scrollHeight,limit)+"px"}$(function(){function t(){$(".section").each(function(){var t=$('#dot-nav a[href="#'+$(this).attr("id")+'"]').data("number"),e=$(this).offset().top,n=$(window).height()/2,o=$(window).scrollTop(),i=e-n<o,a=e+$(this).height()-n>o;i&&a?$("#dot-nav a").eq(t).addClass("is-selected"):$("#dot-nav a").eq(t).removeClass("is-selected")})}function e(t){$("body").animate({scrollTop:t.offset().top+50},500)}t(),window.addEventListener("scroll",t),$(".scroll-down").on("click",function(t){t.preventDefault(),e($(this.hash))}),$("#dot-nav a").on("click",function(t){t.preventDefault(),e($(this.hash))}),$("#overlay a").on("click",function(t){t.preventDefault(),e($(this.hash)),$("#toggle").click()})});var dotNav=document.querySelector("#dot-nav"),about=document.querySelector("#about-section");window.addEventListener("scroll",handleDotNav);var hamburger=document.querySelector("#toggle"),overlay=document.querySelector("#overlay");window.addEventListener("resize",switchNavs),hamburger.addEventListener("click",toggleMenu);var isMobile={Android:function(){return navigator.userAgent.match(/Android/i)},BlackBerry:function(){return navigator.userAgent.match(/BlackBerry/i)},iOS:function(){return navigator.userAgent.match(/iPhone|iPad|iPod/i)},Opera:function(){return navigator.userAgent.match(/Opera Mini/i)},Windows:function(){return navigator.userAgent.match(/IEMobile/i)},any:function(){return isMobile.Android()||isMobile.BlackBerry()||isMobile.iOS()||isMobile.Opera()||isMobile.Windows()}};isMobile.any()||skrollr.init({render:function(t){},smoothScrolling:!1,forceHeight:!1});var contactInput=document.querySelectorAll(".contact-input");contactInput.forEach(function(t){return t.addEventListener("focus",focusInput)}),contactInput.forEach(function(t){return t.addEventListener("blur",blurInput)});var textarea=document.querySelector("#message"),limit=300;textarea.addEventListener("input",autoExpand);
"use strict";function handleNavs(){var t=window.innerWidth>768,e=about.offsetTop-about.offsetTop/4,n=window.scrollY>e,o=overlay.classList.contains("open");t&&n?dotNav.classList.add("active"):t&&o?toggleMenu():dotNav.classList.remove("active")}function toggleMenu(){hamburger.classList.toggle("active"),overlay.classList.toggle("open"),document.body.classList.toggle("noScroll")}function focusInput(){this.parentElement.classList.add("is-active","is-completed")}function blurInput(){this.parentElement.classList.remove("is-active","is-completed")}function autoExpand(){textarea.style.height="",textarea.style.height=Math.min(textarea.scrollHeight,limit)+"px"}$(function(){function t(){$(".section").each(function(){var t=$('#dot-nav a[href="#'+$(this).attr("id")+'"]').data("number"),e=$(this).offset().top,n=$(window).height()/2,o=$(window).scrollTop(),i=e-n<o,a=e+$(this).height()-n>o;i&&a?$("#dot-nav a").eq(t).addClass("is-selected"):$("#dot-nav a").eq(t).removeClass("is-selected")})}function e(t){$("body").animate({scrollTop:t.offset().top+50},500)}t(),window.addEventListener("scroll",t),$(".scroll-down").on("click",function(t){t.preventDefault(),e($(this.hash))}),$("#dot-nav a").on("click",function(t){t.preventDefault(),e($(this.hash))}),$("#overlay a").on("click",function(t){t.preventDefault(),e($(this.hash)),$("#toggle").click()})});var dotNav=document.querySelector("#dot-nav"),about=document.querySelector("#about-section"),hamburger=document.querySelector("#toggle"),overlay=document.querySelector("#overlay");window.addEventListener("scroll",handleNavs),window.addEventListener("resize",handleNavs),hamburger.addEventListener("click",toggleMenu);var isMobile={Android:function(){return navigator.userAgent.match(/Android/i)},BlackBerry:function(){return navigator.userAgent.match(/BlackBerry/i)},iOS:function(){return navigator.userAgent.match(/iPhone|iPad|iPod/i)},Opera:function(){return navigator.userAgent.match(/Opera Mini/i)},Windows:function(){return navigator.userAgent.match(/IEMobile/i)},any:function(){return isMobile.Android()||isMobile.BlackBerry()||isMobile.iOS()||isMobile.Opera()||isMobile.Windows()}};isMobile.any()||skrollr.init({render:function(t){},smoothScrolling:!1,forceHeight:!1});var contactInput=document.querySelectorAll(".contact-input");contactInput.forEach(function(t){return t.addEventListener("focus",focusInput)}),contactInput.forEach(function(t){return t.addEventListener("blur",blurInput)});var textarea=document.querySelector("#message"),limit=300;textarea.addEventListener("input",autoExpand);