Modules with Videos - Code so Closing a Module will ALSO stop the video?

Hi Guys,

This was a design for a client who like the module UX.

I’m just now realizing that when you close a module, the videos continue to play, because the interactions simply ‘Display None’…

Major problem

Any idea of how to stop the video when the module is closed?

Thanks,
Will

Public Share Link: https://preview.webflow.com/preview/tim-1?preview=14028c1d9bad90156e4c20669f3b942c

Take a look at

After looking around, using the Youtube API seemed to be the best solution:

<script>
  
  $(function(){

				var yt_int, yt_players={},
				    initYT = function() {
				        $(".ytplayer").each(function() {
				            yt_players[this.id] = new YT.Player(this.id);
				        });
				    };

				$.getScript("//www.youtube.com/player_api", function() {
				    yt_int = setInterval(function(){
				        if(typeof YT === "object"){
				            initYT();
				            clearInterval(yt_int);
				        }
				    },500);
				});

				$('.pause').on('click', function(){
					yt_players['player1'].pauseVideo();
				});
    
    			$('.pause2').on('click', function(){
					yt_players['player2'].pauseVideo();
				});
        
    			$('.pause3').on('click', function(){
					yt_players['player3'].pauseVideo();
				});
        
    			$('.pause4').on('click', function(){
					yt_players['player4'].pauseVideo();
				});
        
    			$('.pause5').on('click', function(){
					yt_players['player5'].pauseVideo();
				});
        
    			$('.pause6').on('click', function(){
					yt_players['player6'].pauseVideo();
				});
        
    			$('.pause7').on('click', function(){
					yt_players['player7'].pauseVideo();
				});
        
    			$('.pause8').on('click', function(){
					yt_players['player8'].pauseVideo();
				});
        
    			$('.pause9').on('click', function(){
					yt_players['player9'].pauseVideo();
				});
        
    			$('.pause10').on('click', function(){
					yt_players['player10'].pauseVideo();
				});
        
    			$('.pause11').on('click', function(){
					yt_players['player11'].pauseVideo();
				});


			});
  
</script>