Html5視頻播放器在自動播放時必須按暫停兩次

我正在使用此codepen中的代碼http://codepen.io/frytyler/pen/juGfk爲我的視頻播放器製作自定義控件，除非當我將視頻設置爲「自動播放」。它播放的視頻，但我必須按兩次暫停暫停它，我將如何修改代碼來解決這個問題？Html5視頻播放器在自動播放時必須按暫停兩次

<video id="myVideo" autoplay controls preload="auto" poster="http://s.cdpn.io/6035/vp_poster.jpg" width="380" >

來源

2015-12-08 Blake Bowman

在哪裏按？暫停按鈕或屏幕？ – Ivan

要麼你必須在屏幕上按兩次或播放/暫停按鈕兩次在自動播放 –

http://codepen.io/anon/pen/PZwxed

這對屏幕快速的解決方案，在dom.ready內）JS的最後一行（添加該代碼段。

 //doubleclick 
    $('#myVideo').click(function() { 
     if ($("#myVideo").get(0).paused) { 
      $("#myVideo").get(0).play(); 
     } 
    }); 

    $('#myVideo').dblclick(function() { 


     $("#myVideo").get(0).pause(); 

});

那裏當你在屏幕兩次點擊後，點擊按鈕的一個問題，播放/暫停按鈕可充當怪異，你需要指定播放/暫停按鈕類正常顯示，或如果隱藏這一點，會看最好按鈕。

編輯：您可以操縱下面的代碼播放/暫停按鈕：

var vid = document.getElementById("myVideo"); 
    vid.onplaying = function() { 
    //call when video is playing, it should show pause icon in button like .addClass and .removeClass 
}; 
    vid.onpause = function() { 
    //call when video is paused, it should show play icon in button like .addClass and .removeClass 
};

來源

2015-12-08 19:30:29 Ivan

謝謝！只有當我告訴他們雙擊時，這才解決了這個問題，如果您將自己的codepen設置爲自動播放，但仍然不會立即暫停，即使視頻正在播放，它仍會顯示播放狀態。 –

它適用於我，即使我添加了自動播放這個HTML標籤，也許你點擊了三次 – Ivan

它需要工作沒有雙擊，但播放按鈕仍處於播放狀態，當視頻開始播放時，我需要JS識別它正在播放並進入暫停狀態，因此您只需點擊一次即可暫停播放視頻。 –

Html5視頻播放器在自動播放時必須按暫停兩次

回答

相關問題