點擊播放HTML視頻

我有一個非常簡單的情況。我有一個HTML視頻，我有玩，當我點擊有類「.play」點擊播放HTML視頻

$('.play').click(function() { 
    $('.video').get(0).paused ? $('.video').get(0).play() : $('.video').get(0).pause(); 
    $(this).fadeOut(100); 
});

我的問題是一個div，我怎能淡出播放按鈕早在6秒的視頻結束後。播放按鈕絕對位於視頻頂部，因此播放時需要淡出，但在短視頻播放結束後重新出現，用戶可以再次單擊該按鈕，並在需要時再次觀看視頻播放。

來源

2015-11-19 Austin Branham

相當與jQuery

$(document).ready(function() { 
    $('.video').on('ended', function(){ 
     // Do anything that needs to happen when the video is done 
     $('.play').fadeIn(100); 
    }); 
});

來源

2015-11-19 23:31:21 MrGarretto

一個簡單的解決方案，我想通了！通過檢測，如果該視頻被播放使用（或播放）播放和暫停的事件，就像這樣：

$(function(){ 
    var video = $('#video')[0]; 

    video.addEventListener('playing', function(){ 
      $('.play').fadeOut(); 
      //**Add whatever other transitions wanted while video is playing 
    }) 
    video.addEventListener('pause', function(){ 
      $('.play').fadeIn(); 
      //**Add whatever other transitions wanted while video is paused 
    }) 
})

由於此公告：Detect if HTML5 video is playing or paused and show or hide a Div accordingly

來源

2015-11-19 23:33:22

點擊播放HTML視頻

回答

相關問題