1

I have a model window which opens up different types of media, images, audio, mp4, YouTube and Vimeo clips.

I can get the audio and mp4 video clips to pause with the following code: 

$('.icon-close').click(function() {
  $('video, audio').each(function() {
    $(this)[0].player.pause();
  });
});

When it comes to stopping/pausing YouTube and Vimeo clips I'm using the following (as it's the closest thing I have found to stopping the Youtube/Vimeo clips):

$('.icon-close').click(function() {
  $('.media-container iframe').attr('src', $('.media-container iframe', parent).attr('src') + '?autoplay=1');
});

The above stops the video on closing but it also gets rid of the YouTube and Vimeo clips from the page. So when I open the model window back up again then both YouTube and Vimeo clips are not there, in the inspector I get "undefined?autoplay=1 404 (Not Found)"? I'm not sure why I'm losing the videos after I click the close btn, can the above code be altered so I don't lose all the YouTube and Vimeo clips on close?

Thanks,

Nsokyi
  • 394
  • 4
  • 21

1 Answers1

1

Found this snippet and it did the trick for me. 

$(document).ready(function(){
    $('.modal').each(function(){
            var src = $(this).find('iframe').attr('src');

        $(this).on('click', function(){

            $(this).find('iframe').attr('src', '');
            $(this).find('iframe').attr('src', src);

        });
    });
});

Answered here on Stackoverflow by knightkiddo Thanks!

Nsokyi
  • 394
  • 4
  • 21