Tienda

/* HAMBURGUESA */ .fdj-bar{ position:absolute; width:100%; height:2px; background:#593BAD; left:0; transition:all .4s ease; } .fdj-bar:nth-child(1){ top:0; } .fdj-bar:nth-child(2){ top:6px; } .fdj-bar:nth-child(3){ bottom:0; } .fdj-open .fdj-bar:nth-child(1){ transform:rotate(45deg); top:6px; } .fdj-open .fdj-bar:nth-child(2){ opacity:0; } .fdj-open .fdj-bar:nth-child(3){ transform:rotate(-45deg); bottom:6px; } /* LINKS */ .fdj-link{ text-decoration:none; font-size:17px; font-weight:500; color:#593BAD; display:block; overflow:hidden; } .fdj-link span{ display:inline-block; transform:translateY(120%); transition:transform .6s cubic-bezier(.785,.135,.15,.86), color .35s ease; } /* HOVER */ .fdj-link:hover span{ color:#E16B19; transform:translateX(6px); } /* CLICK */ .fdj-link:active span{ color:#E16B19; } /* STAGGER */ .fdj-open .fdj-link:nth-child(1) span{ transition-delay:.05s } .fdj-open .fdj-link:nth-child(2) span{ transition-delay:.1s } .fdj-open .fdj-link:nth-child(3) span{ transition-delay:.15s } .fdj-open .fdj-link:nth-child(4) span{ transition-delay:.2s } .fdj-open .fdj-link:nth-child(5) span{ transition-delay:.25s } .fdj-open .fdj-link:nth-child(6) span{ transition-delay:.3s } .fdj-open .fdj-link:nth-child(7) span{ transition-delay:.35s } .fdj-open .fdj-link span{ transform:translateY(0); } /* RESPONSIVE */ @media(max-width:768px){ #fdj-list{ flex-direction:column; gap:18px; padding-left:40px; } } document.addEventListener("DOMContentLoaded", function(){ const trigger = document.getElementById("fdj-trigger"); const panel = document.getElementById("fdj-panel"); const wrapper = document.getElementById("fdj-wrapper"); const links = document.querySelectorAll(".fdj-link"); let open = false; trigger.addEventListener("click", function(){ if(!open){ panel.style.maxHeight = panel.scrollHeight + "px"; panel.style.opacity = "1"; wrapper.classList.add("fdj-open"); open = true; } else { panel.style.maxHeight = "0"; panel.style.opacity = "0"; wrapper.classList.remove("fdj-open"); open = false; } }); links.forEach(link => { link.addEventListener("click", function(e){ const url = this.getAttribute("href"); /* Si estamos en /tienda/, hacer scroll suave */ if(window.location.pathname.includes("/tienda/")){ e.preventDefault(); const hash = url.split("#")[1]; const target = document.getElementById(hash); if(target){ window.history.pushState(null, null, "#"+hash); window.scrollTo({ top: target.offsetTop - 80, behavior: "smooth" }); } } /* Si no, redirigir normalmente */ else{ window.location.href = url; } /* AUTO CIERRE */ panel.style.maxHeight = "0"; panel.style.opacity = "0"; wrapper.classList.remove("fdj-open"); open = false; }); }); });