I am trying to get a lightbox link to play the video immediately after being pressed, so I don’t get the second play button from the embedded video on Vimeo. Is there any way of doing it?
The play button is in the red circle, when it’s pressed I want it to start playing the showreel from vimeo immediately within the lightbox.
Lightbox is only a trick of hide/show some overlay content (This is not stopping your video).
@bart also posed a really great solution for your use case, but it will require some slight rebuilding! However, I think the end result will be exactly what you want.
Hey, yes, I understand all the interaction bit of how to create the module, what I am struggling is building a custom player that would start playing from pressing the webflow button, which would also make the whole player to appear fullscreen. I can embed the video but it doesn’t respond to webflow button.
Hey Petras! Great question. To help, I’ve built this “replica” website with all the code you need. (I took a look at the embed code you added to your website and you were quite close - your code was just in the wrong spots.)
Please note that both the Play and Pause buttons have IDs of btnPlay and btnPause, respectively. Further, check out the code that I have in the page settings. (This is what actually powers the play/pause functionality.)
In short, the code defines the “player” element (the iframe), and then I followed the Vimeo API docs here and defined an existing player (which is our iframe.)
The code essentially says: when the Play button is clicked, play the video, and when the Pause button is clicked, pause the video. All of the interactions (the pause button appearing and video fading in) are all done natively in Webflow with Interactions 2.0.
Hope that helps! Please let me know if you have any questions at all.
Edit for anyone looking at this solution later on: I’ve updated my replica project with the revised code found at the end of this forum post, so you don’t have to worry about factoring that in!
Wow, thank you so much, I will try to implement this when I get back. Could you please keep the read-only link for a few days for me to preview and analyse what you have done? Thanks a lot!
Most definitely! I do that by default — I never delete websites that I make and post in the forum, just so users in the future can see what I did and not get hit with a 404 Error.
Hmm, it’s weird, I think I replicated everything and play/pause button seems to be working, but the problem is that video hits play and then suddenly stops. Maybe it has something to do with me hiding the whole wrapper? as yours is only made transparent?
(1) Sorry! Should’ve been more clear. I was referring to Incognito Mode / Private Browsing on your browser. This version of your browser is free of any cookies / cache / extensions (unless manually allowed in Incognito mode.) If you’re using Google Chrome, see how to go Incognito here: Browse in private - Computer - Google Chrome Help
(2) Here’s a video of how this looks on my computer. (Ignore the lagging - that’s just because my computer was running too many programs at once while recording! It doesn’t look like that when I’m not recording)
If that’s the case, then I’d be willing to bet some Chrome extension you have is blocking the script for some reason. Check it out in Google Chrome’s incognito mode (if that’s the browser you’re using) and let me know if the issue still persists.
