Background vimeo pause when out of viewport

Hi everyone,


I am building a website that will have 5 animations playing as you scroll down the page, one in each section. I have chosen vimeo to host them and they will be playing as loop background videos using the following embed code:

iframe src=“The New Vimeo Player (You Know, For Videos) from Vimeo Staff on Vimeo” width=“1000px” height=“800px” frameborder=“0” allow=“autoplay; fullscreen” allowfullscreen loop=“1” muted=“1”>

The looping animations are only 6-10 seconds long, however, this will be quite performance demanding if they are all playing at once. Is there a way to have each video start playing when it comes into view and pause when it exits the view? I have seen a few similar queries but haven’t managed to get any of them to work currently.

Thanks in advance!

Here is my site Read-Only: Link

Out off the box thats not possible in Webflow I am afraid. But maybe I am wrong?
This post handles a request like yours.