Search the Community
Showing results for tags 'hamburger'.
-
Hello, I'm using companets like this in my project, but the page can be scrolled up and down. I definitely want to lock the scroll, I just want it to return to normal when I turn it off. Can you help?
-
http://clients.super-agency.com/test/index.html Hello, I made a menu with gsap, but after clicking on a different link from this menu and going back, the menu remains open, I couldn't find a solution, can you help? Where am I doing wrong? Menu code const ham = document.querySelector(".ham"); const menu = document.querySelector('.main-menu'); const links = menu.querySelectorAll('li a'); const menulist = document.querySelectorAll('.menu-list'); var tl = gsap.timeline({ paused: true }); tl.to(menu, { duration: 1, opacity: 1, height: '100vh', ease: 'expo.inOut', width: "100%", }) tl.from(menulist, { duration: .5, opacity: 0, height: '100vh', left: '0', ease: 'expo.inOut', }, "-=0.5"); tl.from(links, { opacity: 0, duration: 1.2, ease: "power4.out", y: 320, stagger: 0.1, }, "-=0.1"); tl.reverse(); ham.addEventListener('click', () => { menuBar.reversed(!menuBar.reversed()); tl.reversed(!tl.reversed()); }); var menuBar = gsap.timeline(); menuBar.to('.bar-1', 0.5, { attr: { d: "M8,2 L2,8" }, x: 1, ease: Power2.easeInOut }, 'start') menuBar.to('.bar-2', 0.5, { autoAlpha: 0 }, 'start') menuBar.to('.bar-3', 0.5, { attr: { d: "M8,8 L2,2" }, x: 1, ease: Power2.easeInOut }, 'start') menuBar.reverse(); Menu Codepen Code https://codepen.io/r3khchand/pen/MWbJOwz