studio-variable/nouveau-theatre-de-besancon
5
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix expandedNav shift on mobile

Browse source
This commit is contained in:
isUnknown 2024-09-20 09:16:45 +02:00
parent 7cf792ed15
commit dbfd54f1a1
3 changed files with 13 additions and 12 deletions
Download patch file Download diff file Expand all files Collapse all files

2
assets/css/src/nav.css
View file

@ -52,8 +52,6 @@
grid-template-columns: 2fr 8fr 1fr; grid-template-columns: 2fr 8fr 1fr;
padding: 3rem var(--space-m) 3rem 1rem; padding: 3rem var(--space-m) 3rem 1rem;
border-bottom: var(--border); border-bottom: var(--border);
transition: top 0.6s var(--curve-quick-slow);
} }
#expanded-nav.open { #expanded-nav.open {
top: 0rem; top: 0rem;

20
assets/js/functions.js
View file

@ -1,24 +1,30 @@
let handleClick; let handleClick;
function expandNav(nodes) { function expandNav(nodes) {
nodes.expandedNav.classList.add("open"); nodes.expandedNav.style = "transition: top 0.6s var(--curve-quick-slow);";
setTimeout(() => {
nodes.expandedNav.classList.add("open");
nodes.burgerBtn.setAttribute("aria-expanded", true); nodes.burgerBtn.setAttribute("aria-expanded", true);
nodes.closeNavBtn.setAttribute("aria-expanded", true); nodes.closeNavBtn.setAttribute("aria-expanded", true);
handleClick = () => closeNav(nodes); handleClick = () => closeNav(nodes);
nodes.main.addEventListener("click", handleClick); nodes.main.addEventListener("click", handleClick);
nodes.footer.addEventListener("click", handleClick); nodes.footer.addEventListener("click", handleClick);
}, 10);
} }
function closeNav(nodes) { function closeNav(nodes) {
console.log("close nav");
nodes.expandedNav.classList.remove("open"); nodes.expandedNav.classList.remove("open");
nodes.burgerBtn.removeAttribute("aria-expanded"); nodes.burgerBtn.removeAttribute("aria-expanded");
nodes.closeNavBtn.removeAttribute("aria-expanded"); nodes.closeNavBtn.removeAttribute("aria-expanded");
nodes.main.removeEventListener("click", handleClick); nodes.main.removeEventListener("click", handleClick);
setTimeout(() => {
nodes.expandedNav.removeAttribute("style");
}, 610);
} }
function show(image) { function show(image) {

3
assets/js/script.js
View file

@ -26,13 +26,10 @@ document.addEventListener("DOMContentLoaded", () => {
setTimeout(() => { setTimeout(() => {
nodes.images.forEach((image) => { nodes.images.forEach((image) => {
console.log(image);
console.log(image.complete);
if (image.complete) { if (image.complete) {
show(image); show(image);
} else { } else {
image.addEventListener("load", () => { image.addEventListener("load", () => {
console.log("image loaded");
show(image); show(image);
}); });
} }