Stop Youtube CMS videos from playing when modal is closed

Hello everyone, I have a CMS of video testimonials, that when clicked would pop out a modal that has some text description + the video itself (YouTube video).

The problem is, when the video continues to play even after I close the modal. I understand this requires a bit of Javascript which is well beyond my code knowledge.

Here’s a Loom summary of what I need

Here is my Read-only link for my Webflow

https://preview.webflow.com/preview/overcomingptsd?utm_medium=preview_link&utm_source=designer&utm_content=overcomingptsd&preview=098df886d9876c15d1519c3e575f0e5d&pageId=61080711823ff7064c403bdc&workflow=preview

Then add below script in body

@eli-webdesigner

    var autoStopperBtn      =   document.querySelectorAll('.auto-stop');

    for (var i = 0; i < autoStopperBtn.length; i++) {
        
        (function(i) {
            
            autoStopperBtn[i].onclick = function () {
                
            var autoStopperModule   =   autoStopperBtn[i].closest('.auto-stopper');
                
            var autoStopperFrame    =   autoStopperModule.querySelector('iframe');
                
            var autoStopperSrc      =   autoStopperFrame.src;
                
            autoStopperFrame.src = ''; // clears url, some browsers wont update the url if it matches existing value.
                
            autoStopperFrame.src = autoStopperSrc;

            }
            
        }(i));
        
    }
           
</script>

Wow. Thank you so much for taking the time to do that! That worked!!

Let me know how I may help you in return. I’ll be happy to drop you a testimonial or anything like that. Really appreciate it brother.

If you have any work or project for me please contact me on my profile Moheen A. - Webflow website Development - Upwork Freelancer from Abbottabad, Pakistan

1 Like

I will definitely do that. I’ve bookmarked your account for future projects. Thank you sir!

This topic was automatically closed 24 hours after the last reply. New replies are no longer allowed.