Hi Ed,
If you take a moment to explore the example file I provided, the advantages of the HypeScrollMagic JS extension over the built-in On Enter/Exit Viewport actions should become quite clear. This extension allows for a more nuanced and customizable approach to scroll interactions.
For starters, it's not limited to just listening for enter and exit events. You can implement custom behaviors and trigger action stacks, offering a much broader scope for interactivity. Additionally, it supports JavaScript callbacks that can be tied to scroll progress, allowing for dynamic responses as the user scrolls through the page.
Another key feature is the ability to link specific timelines to the scroll action, giving you precise control over animation timing and synchronization with the user's scroll position. The extension also enables you to define a boundary box for these interactions, further refining when and where actions are triggered.
One of the more flexible aspects is the ability to set the trigger offset as a percentage of the viewport. This means you can configure actions to be triggered not just at the top, middle, or bottom of the viewport, but at any percentage you choose, enabling a highly tailored user experience.
Beyond these features, there are even more benefits that I haven't fully explored in my current implementation. For instance, ScrollMagic, the underlying library behind this extension, supports horizontal scrolling, which could open up additional creative possibilities.
I have several more ideas in mind that I'm looking forward to implementing as soon as I find some more time. The potential here is vast, and I believe this extension can significantly enhance how we design scroll-based interactions in Hype.
I hope this clarifies the capabilities and advantages of the HypeScrollMagic extension. If you have any more questions or need further examples, feel free to ask!
Best,
MaxZieb