Hype Scroll Trigger

I've rewritten HypeScrollMagic from the ground up using GSAP ScrollTrigger for significantly better performance and modern features.

HypeScrollTrigger brings smooth, high-performance scroll-based animations to Tumult Hype projects. Built on GSAP ScrollTrigger instead of the older ScrollMagic library, it offers:

  • Superior performance and stability
  • Built-in smooth timeline interpolation (enabled by default)
  • Same familiar data-attribute setup via Hype's Identity Inspector
  • Automatic element pinning with wrapper creation
  • CSS custom properties integration for advanced effects
  • Full compatibility with Hype symbols and flexible layouts
  • Comprehensive debugging tools

Setup remains simple - just add your scroll triggers through Hype's Additional HTML Attributes panel. No hand-coding required.

Migration from HypeScrollMagic is straightforward: exchange the library and you're mostly done. The new version handles scene management and refresh automatically.

Includes support for CSS variables, custom behaviors and HypeActionEvents for dynamic scroll behaviors and comprehensive enter/leave events.

8 Likes

Here is the link to download dependencies:
https://gsap.com/docs/v3/Installation/

1 Like

There have been some bugs regarding pinning and some calculations. Next version is coming very soon. Should make it even more powerful. I'm still in the process of implementing it in an actual project, so I'm using that as a testing ground.

3 Likes

Sound great do you have a little example to submit for us.

Thanks in advance.

The thing is currently still in the process of reworking, like I said, in my last post. I will post an example the moment I publish that.

1 Like

Thanks and sorry.

awesome….

1 Like

Hei Max! What about using a scale wrapper? If the trigger elements are inside a scale wrapper (or any kind of group), timelines apparently start immediately when the page loads. Is there a workaround for this?

1 Like