Hi All,
Longtime listener first time caller.
MY INTENTION
- I am creating a page that locks / prevents scrolling at the mid point of each section of a page.
- When the scrolling locks an animation plays. Upon completion of the animation the page unlocks and the user can scroll again.
- I am using body {overflow:hidden;} to prevent scrolling. (Doesn't have to be this but I don't think it's related to the issue)
- I am using a forEach loop to create each sectionsTrig
That's because it you wheel strongly enough, the native scroll could jump so far that it actually spans across MULTIPLE sections (like if each section is 100px high, and the wheel event's deltaY is 300 for example). So you just need to build in logic for cases like that:
See the Pen eYbyWbd?editors=0010 by GreenSock (@GreenSock) on CodePen
Better?