iPad 1在視頻播放完之前觸發視頻結束事件

我有一個包含視頻元素和導航菜單的容器。導航是隱藏的，直到視頻播放完畢，此時視頻被隱藏，導航變得可見。這在桌面上完美工作。但是，在iPad上，視頻無法在「結束」事件明顯結束之前完成播放。另外，由於您無法在iOS中自動播放視頻元素，因此我還會在視頻啓動後捕捉播放事件以隱藏控件。我留下了這個，以防萬一有人知道它造成的問題。儘管如此，它仍然會發生。iPad 1在視頻播放完之前觸發視頻結束事件

是否有解決此問題的方法？我找不到這個問題。在我看來，視頻播放有一些滯後，並且結束的事件在計算的持續時間之後觸發，無論實際需要多長時間完成，儘管這只是猜測。我唯一能確定的是，當結束的事件發生時，視頻沒有完成播放。我在iOS 5在iPad 1上運行的Safari測試

<div id="home-nav"> 
    <video autoplay controls width="870" height="489" id="home-video"> 
     <source src="home_1.mp4" type="video/mp4" /> 
    </video> 
    <div id="nav-overlay"> 
     <a class="link" href="#">Link 1</a> 
     <a class="link" href="#">Link 2</a> 
     <a class="link" href="#">Link 3</a> 
     <a class="link" href="#">Link 4</a> 
    </div> 
</div><!-- /home-nav -->

$(function(){ 
    var overlay = $('#nav-overlay'); 
    var homevideo = $('#home-video'); 
    overlay.hide(); 
    homevideo.bind('ended', function(){ 
     homevideo.hide(); 
     overlay.show(); 
    }); 
    homevideo.bind('play', function(){ 
     homevideo[0].removeAttribute("controls"); 
     homevideo[0].currentTime = 0.1; 
    }); 
});

來源

2012-02-27 raimondious

對於初學者來說，綁定已被棄用。切換到（）。

$(function(){ 
    var overlay = $('#nav-overlay'); 
    var homevideo = $('#home-video'); 
    overlay.hide(); 

    homevideo.on('ended', function(){ 
     $(this).hide(); 
     overlay.show(); 
    }); 

    homevideo.on('play', function(){ 
     $(this).removeAttribute("controls"); 
     $(this).get(0).currentTime = 0.1; 
    }); 
});

試試看。

來源

2012-07-07 17:14:04

iPad 1在視頻播放完之前觸發視頻結束事件

回答

相關問題