0

Tentei criar uma função em javascript para permitir que fosse possivel pular alguns segundos em um video, mas ao clicar no botão o video simplesmente volta ao começo.

var video = document.getElementById("video1");
var segundos = 30;
function skip(segundos) {
    video.currentTime += segundos;
}

a função é chamada no HTML

            <button class="pular" onclick="skip(segundos)">Skip</button>

Eu segui os exemplos dados no https://msdn.microsoft.com/pt-br/library/hh924823(v=vs.85).aspx mas não funcionou.

9
  • Só interessa o botão pular?
    – user60252
    Commented 5/05/2017 às 13:02
  • No caso meu problema está sendo apenas com o botão de pular, preciso fazer um para avançar e um para voltar. O outro botão é o de paly/pause, mas esse já etá funcionando.
    – Vitor Hugo
    Commented 5/05/2017 às 13:04
  • Considere usar um jquery
    – user60252
    Commented 5/05/2017 às 14:34
  • Leo e qual função do Jquery faria isso?
    – Vitor Hugo
    Commented 5/05/2017 às 16:12
  • só fazer o que está na resposta não esquecer da biblioteca <script src="ajax.googleapis.com/ajax/libs/jquery/3.2.1/…>
    – user60252
    Commented 5/05/2017 às 16:15

1 Resposta 1

-1

Com jquery fica facil

    function vidplay() {
       var video = document.getElementById("Video1");
       var button = document.getElementById("play");
       if (video.paused) {
          video.play();
          button.textContent = "||";
       } else {
          video.pause();
          button.textContent = ">";
       }
    }

    function restart() {
        var video = document.getElementById("Video1");
        video.currentTime = 0;
    }

    function skip(value) {
        var video = document.getElementById("Video1");
        video.currentTime += value;
    }

    $(document).ready(function(){
       var segundos = 30;
       document.getElementById("buttonbar").innerHTML = '<button id="restart" onclick="restart();">restart</button>\n<button id="rew" onclick="skip(-'+segundos+')">-'+segundos+'</button>\n<button id="play" onclick="vidplay()">></button>\n<button id="fastFwd" onclick="skip(+'+segundos+')">+'+segundos+'</button>';

    });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 

<video id="Video1">
     <source src="http://kithomepage.com/sos/deo.mp4" type="video/mp4" />
     <source src="demo.ogv" type="video/ogg" />
     HTML5 Video is required for this example. 
     <a href="demo.mp4">Download the video</a> file. 
</video>

<div id="buttonbar">
</div> 

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .