Website embeds - play on scroll into view

1

Hi guys,

Are there any reliable & simple methods to trigger hype animations such as when a website button is triggered or a section scrolls into view. I am no JS / hype ninja, but I can copy and paste scripts very efficiently :laughing:. I am playing around with webflow hype embeds as a side project.

2

For showing a Hype animation when visible, you would use a Viewport Action: https://tumult.com/hype/documentation/#viewport-actions

The button example on this section is what you would want for triggering an action from outside of Hype: https://tumult.com/hype/documentation/#invoking-api-from-outside-oftumult-hype

<button type="button" onclick ="HYPE.documents['scenes-transitions'].showSceneNamed('Scene2',HYPE.documents['scenes-transitions'].kSceneTransitionPushRightToLeft);">
   Show Scene 2 (Push Right to Left)
 </button>

The above code assumes you had a document embedded with the export name scenes-transitions.

3 Likes
3

Thanks @Daniel!. That all looks workable !

1 Like