Pausa Vimeo universal incrustada cuando está oculta usando jQuery

Tengo un video de Vimeo (a través de un iframe de inserción universal) oculto en mi página. Al hacer clic en un enlace se desvanece y al hacer clic fuera del video (lightbox-style) se desvanece y lo oculta, pero el video continúa reproduciéndose. Leí en Vimeo's API que puedes usar objetos JSON para pausar el video, pero no entiendo lo que dicen.Pausa Vimeo universal incrustada cuando está oculta usando jQuery

HTML:

<img id="show_tide" class="vid" src"#"> 
<i<iframe id="tide" class="vim" src="http://player.vimeo.com/video/1747304?portrait=0&amp;color=ffffffapi=1" width="726" height="409" frameborder="0"></iframe>

JavaScript:

$('#underlay').click(function() { 
    //pause VISIBLE (there are multiple) Vimeo video via API 
    $('.vim, #underlay').fadeOut(400); 
});

Fuente

2011-04-08 technopeasant

dudo que tiene '', ¿cuál es el código real allí? – Khez

@ Khez- ¡actualizado! – technopeasant

¿Estás seguro de que quieres usar el modo iframe? Significará que los botones no funcionarán en algunos navegadores ... – Khez

Es necesario añadir de uno de los froogaloop libraries.

player=$f(document.getElementById('tide'));// you can use jquery too: $('#tide')[0] 
player.api('pause');

Irritantemente sencilla. Aquí hay un example on jsfiddle.net.

Fuente

2011-04-08 05:11:31 Khez

@Khez actualizó el jsfiddle con mi código. funciona allí ... pero no funciona dentro de la página. ¿Ves algo que pueda ser conflictivo? http://jsfiddle.net/CVWtL/11/ – technopeasant

¿Qué no está funcionando? – Khez

@Khez, el video no se detiene en mi página. Estoy usando la función que pegué en jsfiddle. Por mi vida no puedo entender por qué no está funcionando: // – technopeasant

Aquí está una manera simple de hacer una pausa en un vídeo de Vimeo de un elemento HTML externo que trabajó para mí, usando la librería del froogaloop:

var iframe = $('.video')[0]; 
var player = $f(iframe); 
$('.button').bind('click', function() { 
    player.api('pause'); 
});

Fuente

2012-07-03 17:35:33

que quería añadir un botón de reproducción/pausa como esto sin usar jQuery o froogaloop. No sé por qué, pero odio incluir una biblioteca cuando no es necesario. Especialmente para cosas simples como esta.

Esto es lo que se me ocurrió (Estoy publicar esto para otras personas que están buscando):

<!DOCTYPE HTML> 
<html> 
<head> 
    <title>Vimeo Test</title> 
    <script language="JavaScript"> 
    var iFram, url; 
    function startitup(){ 
     iFram = document.getElementById('theClip'); 
     url = iFram.src.split('?')[0]; 
    } 
    function postIt(action, value) { 
     var data = { method: action }; 
     if (value) { 
      data.value = value; 
     } 
     if(url !== undefined){ 
      iFram.contentWindow.postMessage(JSON.stringify(data), url); 
     } 
    } 
</script> 
</head> 
<body onload="startitup();"> 
<iframe id="theClip" src="http://player.vimeo.com/video/27855315?api=1" width="400"  height="225" frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen> </iframe> 
<p><button onclick="postIt('play');">Play</button> <button  onclick="postIt('pause');">Pause</button></p> 
</body> 
</html>

Fuente

2013-05-06 17:27:17 Josh

Estoy un poco tarde a la fiesta, pero tenía que cargar froogaloop, jQuery , y la API de Vimeo también.

asegúrese de añadir ?api=1&player_id='frame' hasta el final de su enlace de vídeo incorporado

Mi código se veía algo como esto después de

<iframe id="frame" src='http://player.vimeo.com/video/199114019?api=1&player_id='frame''></iframe> 
 

 
$(document).ready(function() { 
 
    $('.nameofyourclass').click(function() { 
 
     $f($('#frame')[0]).api('pause'); 
 
    }); 
 
});

Fuente

2017-01-15 02:27:05

Pausa Vimeo universal incrustada cuando está oculta usando jQuery

Respuesta

Cuestiones relacionadas