jquery - standard - HTML5 Video Stop onClose

jquery remove data attribute

Question

Estoy usando herramientas jQuery para una superposición. Dentro de la superposición tengo un video HTML5. Sin embargo, cuando cierro la superposición, el video sigue reproduciéndose. ¿Alguna idea de cómo puedo hacer que el video se detenga cuando cierre la superposición? Aquí está el código que tengo:

$("img[rel]").overlay({ onClose: function() { <stop the video somehow> }, mask: { color: ''#000'', opacity: 0.7 }});

Traté de usar

$(''video'').pause();

Pero esto también detuvo la superposición.

Answer 1

Alguien ya tiene la respuesta.

$ (''video'') devolverá una serie de elementos de video. ¡Es totalmente un seletor válido!

asi que

$("video").each(function () { this.pause() });

trabajará.

Answer 2

El problema puede ser que con el selector jquery que eligió $("video") no es un selector

El selector de la derecha puede poner un elemento de identificación para la etiqueta de video, es decir,
Digamos que su elemento de video se ve así:

<video id="vid1" width="480" height="267" oster="example.jpg" durationHint="33"> 
    <source src="video1.ogv" /> 
    <source src="video2.ogv" /> 
</video> 

Luego puede seleccionarlo a través de $("#vid1") con marca de $("#vid1") (#), selector de identificación en jQuery. Si un elemento de video está expuesto en la función, entonces usted tiene acceso a HtmlVideoElement (HtmlMediaElement) .Este elemento tiene control sobre el elemento de video, en su caso, puede usar el método pause() para su elemento de video.

Compruebe la referencia para VideoElement here .
También verifique que haya una referencia alternativa here .

Answer 3

Los siguientes trabajos para mí:

$(''video'')[0].pause();

Answer 4

Mi experiencia con Firefox es que al agregar el atributo '' id '' a un elemento de video, Firefox se bloquea por completo ... al pedirle que envíe un informe de error. Retire el elemento id y funciona bien. No estoy seguro si esto es cierto para todos, pero pensé que compartiría mi experiencia en caso de que ayude.

Answer 5

Para ahorrar horas de tiempo de codificación, use un complemento jquery ya optimizado para iframes de video incrustados.

Pasé un par de días tratando de integrar la API moogaloop de Vimeo con las herramientas jquery sin éxito. Ver esta lista para un puñado de opciones más fáciles.

Answer 6

Para una aplicación JQM + PhoneGap, lo siguiente me funcionó.

Lo siguiente era lo mínimo que tenía que hacer para que esto funcionara. En realidad, estaba experimentando un bloqueo debido al almacenamiento en búfer al generar solicitudes de Ajax cuando el usuario presionó el botón Atrás. Pausar el video en Chrome y el navegador de Android lo mantuvo en búfer. La solicitud ajax no asíncrona se atascaría a la espera de que finalice el almacenamiento en búfer, lo que nunca lo haría.

Vincular esto al evento beforepagehide lo arregló.

 $("#SOME_JQM_PAGE").live("pagebeforehide", function(event)
 {
           $("video").each(function () 
           { 
               logger.debug("PAUSE VIDEO");
               this.pause();
               this.src = "";
           });
 });

Esto borrará cada etiqueta de video en la página.

La parte importante es this.src = "";

Answer 7

Prueba esto:

if ($.browser.msie)
{
   // Some other solution as applies to whatever IE compatible video player used.
}
else
{
   $(''video'')[0].pause();
}

Pero, tenga en cuenta que $ .browser está en desuso, pero no he encontrado una solución comparable.

Answer 8

Si quieres que no se reproduzcan todas las etiquetas de película de tu página, este pequeño fragmento de jQuery te ayudará a:

$("video").each(function () { this.pause() });

Answer 9

Video de inicio con diferentes navegadores.

Para la opera 12

window.navigator.getUserMedia(param, function(stream) {
                            video.src =window.URL.createObjectURL(stream);
                        }, videoError );

Para Firefox Nightly 18.0

window.navigator.mozGetUserMedia(param, function(stream) {
                            video.mozSrcObject = stream;
                        }, videoError );

Para cromo 22

window.navigator.webkitGetUserMedia(param, function(stream) {
                            video.src =window.webkitURL.createObjectURL(stream);
                        },  videoError );

Deteniendo video con diferentes navegadores

Para la opera 12

video.pause();
video.src=null;

Para Firefox Nightly 18.0

video.pause();
video.mozSrcObject=null;

Para cromo 22

video.pause();
video.src="";