Vimeo : Play interaction after video is done playing

Hi!

I have been working on this project for a little while now and we’ve ran into several problems I did not anticipate when first starting. First of all with the autoplay, because I was not aware of Google’s recent actions for videos autoplaying with sound so I’ve had to find ways to implement it nonetheless with a button to turn the sound on and off.

The problem we’re currently facing though is that my client wants to have an interaction lead to the home page after the video is done playing. The way I initially thought about doing this interaction was by making it wait 20 seconds until the intro modal with the video can disappear and the home page elements can appear.

But at the moment, the video doesn’t always load immediately and it creates our problem where the interaction starts playing before the video is properly over thus cutting short the expected result.

Has anyone else ever ran into this sort of problem in the past? Is there any javascript I could use that triggers the webflow interaction when the video is over? Is this even possible with an embedded Vimeo iframe?

Thanks in advance for any help you can offer, here’s the preview link : https://pulpe-test.webflow.io/

Vincent


Here is my public share link: LINK
(how to access public share link)

Try this maybe?

Hi @dram,

I have tried to use this solution but can’t seem to get it working. I’ve tried integrating it all in the embed, then in the page’s custom code, but to no avail. The froogaloop cdn also seemed to be non-secure the first time so I went and added one from a secured link. Even when I had no errors nothing seemed to happen.

Any idea why or where I went wrong?

This solution is also not ideal for our mobile version since the intro video modal isn’t present on mobile and I’m unsure how to redirect the index to another page on mobile within webflow.

Sorry about that. I dug a bit and it looks like that particular script is deprecated and new one is used istead - https://player.vimeo.com/api/player.js. Unfortunately after playing around that script and changing this and that in the script itself I had no luck to make it work. I do not have the time to dig into this properly (and my JS knowledge is very limited so it is a pain for me). Perhaps someone will look at the vimeo api? The way to do what you want to do is certainly there!

Review the vimeo player methods. Look at getEnded(). This method gets the ended state of the video, where true indicates that the video has ended. The video has ended if its current playback position is exactly equal to its duration.

https://developer.vimeo.com/player/sdk/reference#about-player-methods