Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Eae galera blz?
Então, sou novo por aqui, e tenho uma dúvida.
Eu tenho um projeto que é o seguinte.
Tem uma pagina que tem o video do youtube, só que o cliente quer que quando acabe o video, no lugar dele entre um carrousel de imagens.
O meu problema é o seguinte, como faço via, jquery/javascript, saber quando o video terminou?
valeuu!
Veja este link, já usei e funcionou.
https://developers.google.com/youtube/js_api_reference?hl=pt-br
Procure por essa parte:
player.getPlayerState():Number
Retorna o estado do player. Os possíveis valores são não iniciado (-1), encerrado (0), em reprodução (1), pausado (2), armazenando em buffer (3), vídeo indicado (5).
O meu caso foi o seguinte, eu tinha que fazer com que, quando o player estivesse ativo (ou seja, na função 'tocando') ele tinha que abaixar o volume de um player em javascript.
Você pode ver um exemplo funcionando no link: http://opcaoimoveis-es.com.br/index2.php.
Aguarde a página carregar e dê play no vídeo, você ira perceber que, quado está tocando o volume da musica abaixa.
E quando está parado a musica sobe.
Então o meu código fico assim:
HTML:
<div class="manhattan">
<script src="js/elements/swfobject.js"></script>
<div class="youtube">
<div id="ytmhtplayer"></div>
</div>
</div>
JAVASCRIPT:
<script>
var params = {
allowScriptAccess: "always"
};
var atts = {
id: "ytmhtplayer"
};
swfobject.embedSWF("http://www.youtube.com/watch?v=f9NuxUIwO7k?rel=0&fs=0&showinfo=0&wmode=transparent&enablejsapi=1&playerapiid=ytplayer","ytmhtplayer", "100%", "100%", "8", null, null, params, atts);
function onYouTubePlayerReady(playerId) {
ytplayer = document.getElementById("ytmhtplayer");
ytplayer.addEventListener("onStateChange", "onytplayerStateChange");
}
function onytplayerStateChange(newState) {
if(newState == 1 || newState == 2 || newState == 3){
alert('O player está tocando');
} else {
alert('O player está parado ou o video terminou');
}
}
</script>
Ali onde está 'swfobject.embedSWF("http://www.youtube.com/watch?v=f9NuxUIwO7k?' troque pelo id do vídeo que deseja.
Agora o estado de finalizado, como a própria API diz é o estado '0', então os if's de verificação devem ficar assim:
function onytplayerStateChange(newState) {
if(newState == 0){
alert('O video foi encerrado');
} else {
alert('O player está ativo');
}
}
IMPORTANTE!
Você deve linkar o arquivo swfobject.js para a sua página, pra API funcionar, você pode baixar a versão atualizada nesse link:
https://code.google.com/p/swfobject/downloads/detail?name=swfobject_2_2.zip
É isso amigo, boa sorte.
Cara, parece ser muito bom, vou tentar depois passo o feedback aqui
Valeu!!!!
Valeu cara, consegui fazer oq eu queria.
Obrigado!
Nem imagino, mas tenho uma teoria de que talvez você consiga fazer isso com Flash, por criar um filme que sirva de contêiner para o filme principal, que contém o vídeo.
Não sou programador ActionScript e o que faço é pura especulação, mas imagino que desa forma o filme-contêiner tenha como saber se outro filme completou ou não sei ciclo de vida.