 |
|
|
|
Você está aqui: HTML5 ::: HTML5 + JavaScript ::: Video - HTMLVideoElement |
Definindo a posição atual do vídeo que está sendo executado no elemento video do HTML5Quantidade de visualizações: 1246 vezes |
|
Em algumas situações nós gostaríamos de definir a posição do vídeo sendo executado no elemento <video> do HTML5. Isso pode ser feito fornecendo um valor em segundos (pode ser fracionário) para a propriedade currentTime do elemento HTMLMediaElement, herdada pelo elemento HTMLVideoElement. No trecho de código abaixo nós temos um elemento <video>, no qual o vídeo será carregado, uma caixa de texto e um botão. Informe a posição desejada do vídeo no formato hh:mm:ss e clique no botão para visualizar o resultado. Veja a listagem: ----------------------------------------------------------------------
Se precisar de ajuda com o código abaixo, pode me chamar
no WhatsApp +55 (62) 98553-6711 (Osmar)
----------------------------------------------------------------------
<!DOCTYPE html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Como usar a tag video do HTML5</title>
</head>
<body>
<video controls="controls" id="video" src="filme.mp4">
Seu browser não dá suporte ao elemento video do HTML5.
</video>
<form>
Digite a posição do vídeo (formato hh:mm:ss):<br>
<input type="text" id="posicao" name="posicao"/>
<input type="button" onClick="definirPosicao()"
value="Definir Posição do Vídeo" />
</form>
<script type="text/javascript">
function definirPosicao(){
// vamos obter uma referência ao elemento <video>
var video = document.getElementById('video');
// vamos obter a nova posição do vídeo
var posicaoTxt = document.getElementById('posicao').value;
var partes = posicaoTxt.split(':');
var segundos = (parseInt(partes[0]) * 60 * 60) +
(parseInt(partes[1]) * 60) + (parseInt(partes[2]));
// vamos ajustar a posição do vídeo
video.currentTime = segundos;
}
</script>
</body>
</html>
|
 Link para compartilhar na Internet ou com seus amigos: |
Veja mais Dicas e truques de HTML5 |
Dicas e truques de outras linguagens |
E-Books em PDF |
||||
|
||||
|
||||
Linguagens Mais Populares |
||||
|
1º lugar: Java |
