Jump to content
Search Community

Sholi

Members
  • Posts

    3
  • Joined

  • Last visited

Everything posted by Sholi

  1. Here is my code example for menu anchors gsap.utils.toArray('.navigation-link').forEach(function (nav, i) { nav.addEventListener('click', (e) => { const id = e.target.getAttribute('href'); gsap.to(window, {duration: 1, scrollTo:{y: `${id}`, offsetY:0}}); e.preventDefault(); }); }); It works perfectly! But my sections are pined (look code above) gsap.utils.toArray('.overscroll').forEach((section, i) => { ScrollTrigger.create({ trigger: section, start: "bottom bottom", pin: true, pinSpacing: false, }); }); So, when i click forward, for example, from second nav link to fifth it works perfectly! But if I click backward (from 4 nav link to 2 nav link) it took me to wrong section position((( When I disable pin: true it started work perfectly, but for my project I need these feature PS Is is vertical scroll Plz help?
  2. Sholi

    Overlaping sections

    @Rodrigo Tnx you so much!?
  3. Sholi

    Overlaping sections

    Is it possible to do with gsap animation like this https://codyhouse.co/ds/components/app/overscroll-section I'm strugguling with pined sections due to they dont scroll My code example gsap.utils.toArray(sections).forEach((section, i) => { ScrollTrigger.create({ trigger: section, start: 'top top', pin: true, pinSpacing: false, onUpdate: self => console.log("progress:", self.progress), snap: { snapTo: sections, // snap to the closest label in the timeline duration: {min: 0.2, max: 3}, // the snap animation should be at least 0.2 seconds, but no more than 3 seconds (determined by velocity) delay: 0.2, // wait 0.2 seconds from the last scroll event before doing the snapping ease: "power1.inOut" // the ease of the snap animation ("power3" by default) } }); });
×
×
  • Create New...