Pause Vimeo on Layout unload

I created a javascript function that plays an embedded Vimeo video on scroll.

The problem now is that the video keeps running when the layout changes.

The script loads when the layout loads.

Should I add a new function to this script or should I create a new script on scene unload?

scroll_test.zip (28.8 KB)

I myself would probably make a script that gets called on the layout unload, but it may depend on the end complexity/amount of videos on the final page.

A common technique I’ve also seen is to add a class to the Hype element, and then on unload for all elements of that class to just blank out the innerHTML which would effectively kill the video element. It would get recreated again on the scene/layout load.

2 Likes

Similar to what Jonathan suggested, but instead of making the container empty, just keep reloading the content with the same HTML code.

I used a html file that contains the video embedded code, and for each layout, it reloads the container with the same code, forcing it to start over again, also with this you don’t need different IDs for each container.

scroll_test_HTMLFile.zip (17.5 KB)

1 Like