Foundation 6 stop vimeo play on reveal close

I’m trying to figure out how to get a Vimeo video to stop playing if “reveal modal” is closed, but the video just keeps playing and I can’t get this figured out. Anyone have any suggestions of how to get the video to stop play on close? Below is my code.

Thanks!!

<div class="large-4 medium-4 medium-pull-2 cell">
            <a class="button primary large expanded rounded" data-open="modal3">Intro Video</a>
                <div class="reveal large" id="modal3" data-reveal data-animation-in="fade-in" data-animation-out="fade-out">
                    <h2>Intro Video</h2>
                        <div class="responsive-embed widescreen">
                            <iframe title="vimeo-player" src="https://player.vimeo.com/video/264555007" frameborder="0" allowfullscreen></iframe>
                        </div>
                        <button class="close-button" data-close aria-label="Close reveal" type="button"><span aria-hidden="true">&times;</span></button>
                </div>   
          </div>

See https://www.google.com/search?channel=fs&client=ubuntu&q=vimeo-player+iframe+stop+javascript which lists some options.

We also have events when a modal is closed.

1 Like

Thanks for the help DanielRuf.
I got this squared away and working now with the script below.
Many thanks!!!

<script>
    jQuery(document).on('closed.zf.reveal', function(event) {
        $('.video-player').each(function(index) {
        $(this)[0].contentWindow.postMessage('{"method":"unload"}','*');
        });
    });
</script>