VideoJS: detención de video en cierre modal y no incrustado en la página

Question

He estado usando el script de JavaScript VideoJS: http://videojs.com/ para crear algunos reproductores de video que se pueden mostrar al usuario en una ventana emergente. He construido la ventana emergente de la siguiente manera:

 <script type="text/javascript"> 

      VideoJS.setupAllWhenReady(); 

      jQuery(document).ready(function() 
      { 
       // videos have video js applied to them 
       //$("video").VideoJS() 

       $(".show-video").click(function() 
       { 
        $(".video-background").show(); 
        $(".video-container").fadeIn("fast"); 
       }); 
       $(".close-video").click(function() 
       { 
        $('.video-background').fadeOut(); 
        $('.video-container').fadeOut(); 

       }); 
      }); 
     </script> 

<a class="show-video">Show Video</a> 

     <div class="video-background"> 
      <div class="video-container"> 

       <div class="video-js-box vim-css"> 
        <video id="video1" class="video-js" poster="wallpaper.png" controls="controls" width="1024" height="768"> 
         <source src="video.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"' /> 
         <object id="flash_fallback_1" class="vjs-flash-fallback" width="1024" height="768" type="application/x-shockwave-flash" 
          data="http://releases.flowplayer.org/swf/flowplayer-3.2.1.swf"> 
          <param name="movie" value="http://releases.flowplayer.org/swf/flowplayer-3.2.1.swf" /> 
          <param name="allowfullscreen" value="true" /> 
          <param name="flashvars" value='config={"playlist":["poster.png", {"url": "video.mp4","autoPlay":false,"autoBuffering":true}]}' /> 
          </object> 
        </video> 
       </div> 

       <a class="close-video">Close Video</a> 

      </div> 
     </div> 

Tengo dos problemas:

1) Si se reproduce el vídeo y el usuario cierra la ventana emergente de vídeo, el vídeo se seguirá jugando en el fondo .. . ¿Cómo paro esto?

2) He notado en sitios como: http://www.apple.com/imac/features.html que los videos aparecen de la misma manera usando un hashtag y una identificación para mostrar contenido pero a diferencia de mi ejemplo el video no está en la página ... alguna idea sobre cómo hacen esto? Como no están cargando una página web externa. Me encantaría ver algunos ejemplos de cómo hacer esto con jQuery, ya que tendré varios videos, así que sería fantástico simplemente incorporarlos según el hashtag en el enlace.

Gracias

Answer 1

Hay 2 maneras de hacer esto.

1. Elimina el video completo cuando se cierra la ventana emergente. Utilice $(video).remove()

2. utilizan los videojs javascript método

   VideoJS.DOMReady(function(){ 
       var myPlayer = VideoJS.setup("example_video_1"); 
       myPlayer.pause(); 
   }); 
   

Answer 2

http://help.videojs.com/discussions/suggestions/9-play-and-pause-video-via-jquery

Poner en función de donde se desea que el vídeo para hacer una pausa en "jquery.reveal.js"

$(".video-js")[0].player.pause(); 

Answer 3

Este código impide que varios jugadores se ejecuten en una galería de videos:

$(".video-js").each(function() { 

    $(this).player.pause(); 

});