vacp2p/vac.dev-experimental-old
1
0
Fork 0
mirror of https://github.com/vacp2p/vac.dev-experimental-old.git synced 2025-01-27 05:55:37 +00:00
Code Issues Packages Projects Releases Wiki Activity

Add smooth scrolling

Browse Source
This commit is contained in:
Maria Rushkova 2021-07-30 18:00:52 +02:00
parent 8524e4aa46
commit a4cc801969
2 changed files with 22 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
assets/js/main.js
View File

@ -1,25 +1,31 @@
"use strict";
document.querySelectorAll(".nav__link").forEach((link) =>
link.addEventListener("click", function (e) {
e.preventDefault();
const id = e.target.getAttribute("data-href");
document.querySelector(id).scrollIntoView({
behavior: "smooth",
});
})
);
const burger = document.querySelector(".burger");
const burgerOpen = document.querySelector(".burger__button--open");
const burgerClose = document.querySelector(".burger__button--close");
const menuMobile = document.querySelector(".nav-mobile");
const menuLinks = document.querySelectorAll(".nav__link");
const overlay = document.querySelector(".overlay");
burger.addEventListener("click", function (e) {
e.preventDefault();
const closeMobileMenu = () => {
burgerOpen.classList.toggle("hidden");
burgerClose.classList.toggle("hidden");
menuMobile.classList.toggle("hidden");
overlay.classList.toggle("hidden");
};
burger.addEventListener("click", function (e) {
e.preventDefault();
closeMobileMenu();
});
menuLinks.forEach(function (link) {
link.addEventListener("click", function (e) {
closeMobileMenu();
const id = e.target.getAttribute("href").slice(1);
console.log(document.querySelector(id));
document.querySelector(id).scrollIntoView({
behavior: "smooth",
});
});
});

4
src/style.css
View File

@ -2,6 +2,10 @@
@tailwind components;
@tailwind utilities;
html {
scroll-behavior: smooth;
}
h1 {
font-size: 32px;
line-height: 44px;