I've encountered an issue while using FullPage with scrollOverflow: true. I need to scroll to a specific position in a scrollable section. The problem arises from the fact that FullPage utilizes a modified version of the iScroll plugin for these overflow sections.
My current approach involves:
- Triggering FullPage scroll to the desired section
- Finding the instance of iScroll within that section and triggering its scrollTo() event
- Rebuilding FullPage
Although the scroll positions of both plugins adjust correctly, there seems to be a glitch where FullPage fails to recognize iScroll's scrollTo() event. As a result, it behaves as if the active section is scrolled to the top, causing scrolling up to go to the previous section and scrolling down to move below the content unexpectedly.
document.querySelector('.button').addEventListener('click', e => {
fullpage_api.moveTo(3)
fullpage_api.getActiveSection().item.querySelector('.fp-scrollable').scrollTo(0, 1000, 1000)
fullpage_api.reBuild()
})
To demonstrate the bug, here is a simplified version of my code: https://jsfiddle.net/5bojtrmd/13/
After clicking the button, you won't be able to reach the title of section 3 anymore, and you can scroll into a red zone that shouldn't be visible.