[Scroll Trigger with Snapping sections causing issues with Back to top Button]

Thanks for the reply back.  The issue is not in CodePen. It's happening when you're on an actual webpage and you try to refresh/reload the page after scrolling past the snapped sections. 

 

The result:  On refresh/reload takes the user back to the snapped section.

 

[Scroll Trigger with Snapping sections causing issues with Back to top Button]

Just to piggyback on this same topic.

 -On page reload/refresh or when I'm navigation back to the page it takes me back down to the ScrollTriiger section with the callbacks.

@GreenSock  - anyway to prevent the "onEnterBack" callback from firing on page reload/refresh?

[Scroll Trigger with Snapping sections causing issues with Back to top Button]

Thanks for helping out and making updates the ScrollTrigger.min.js file.  I'll use the new beta version moving forward. I appreciate effort and thanks again.

[Scroll Trigger with Snapping sections causing issues with Back to top Button]

Hi @elegantseagulls,

 

Thank you for getting back to me so quickly and looking into the issue. In my codepen example I'm using the disable() functionality on the click event of the "back-to-top" button and then onComplete of the scroll using enable() functionality. 

 

 

// Scroll to top Button
const scrollTopBtn = document.querySelector('.btn-top');

var enableGsap = function () {
	ScrollTrigger.getAll().forEach(test => test.enable());
}

scrollTopBtn.addEventListener('click', function () {
  
  ScrollTrigger.getAll().forEach(test => test.disable());
    gsap.to(window, {
        duration: 1.5, 
        scrollTo: {
          y: 0,
          x: 0,
          autoKill: true
        },
      onComplete: enableGsap
    });
});

 

Let me know if I'm doing something incorrectly.

 

Thanks!

[Scroll Trigger with Snapping sections causing issues with Back to top Button]

Hello GSAP Team,

 

I'm new to Scroll Trigger and having issues trying to scroll back to the top of the page.  I've created a snapping section in the middle of the page that acts like a "road block". That works well.

 

At the bottom of the page, I have a button that scrolls you user back to the top of the page when clicked on. Here lies the issue. Once the scroll reaches the top of the page, it then starts scrolling back down to the snapping section.

 

I need it to stay at the top with out it scrolling back down. 

 

Thanks!

 

See the Pen abJoyjJ by DariuszJ (@DariuszJ) on CodePen