Delay makes ScrollTo work incorrectly

[henery]

Hi!
 

I am trying to make a slightly delayed ScrollTo animation when the user scrolls up/down using observer plugin. It works, but when the delay value is small it sometimes glitches, jumping directly to the scroll position instead of playing the animation.

 

Here's a video where the animation works the first time but glitches the next times. 

 

Thanks in advance for the help

See the Pen xxWzxMQ by sryhnry (@sryhnry) on CodePen

[Cassie]

Hey there!

 

I can't see the flicker, so hard for me to test, but maybe it's because if it fires a few times the tween gets overridden?

 

You could add in a little check and only animate if the animation isn't playing?

See the Pen xxWzxMQ?editors=0010 by sryhnry (@sryhnry) on CodePen

[henery]

Hi! Thanks for the suggestion! I've done that but the glitch still happens, I've tested with a Macbook to see if it was my other computer but it also happens there. 

 

 

[Cassie]

Ah, that's a shame.

 

I just noticed you have scroll snap set up in your CSS, what was the aim there? It doesn't seem necessary as you're animating the scroll position based on events, not actually scrolling down through sections. That may be messing with things?

[henery]

Oh yes. That solves it. Thanks! The problem now is that the scroll snap was there so to make sure that when scrolling through sections without the mouse wheel (i.e. using the up and down buttons on the scrollbar, or dragging the scrollbar itself) it always snapped to one section. Now, it doesn't snap unless navigating with the mouse wheel. I'll see if I can find a way to make it work like when snap was set, but without setting it. Suggestions are appreciated  Thanks for the help again. 

 

 

 

[henery]

So, I think I found a solution using scrollTrigger snap. Just in case anyone is following the topic. 

 

See the Pen vYRrqwq by sryhnry (@sryhnry) on CodePen

 

I am aware that using both an observer to scroll to a section and snap may seem redundant, as I could remove the observer and have basically the same functionality. The thing is I really like how smooth observer + scrollTo looks since the scrollbar doesn't jump and then snap, it scrolls directly to the snap point. Idk I'm just playing around!

 

Thanks again for the help. I'm still learning the library and it's so much fun but it can get very complex as well!