鉻html5視頻buffered.end事件

我試圖檢測視頻文件何時完成加載。我使它在firefox和safari上成功運行，但在chrome上，緩衝事件表現奇怪。 so，在我的本地主機chrome中工作正常，但是當我上傳到服務器時;鉻html5視頻buffered.end事件

緩衝百分比停止約50％，但緩衝區100％，
當頁面刷新，百分比入住％0，但它繼續緩衝..

這裏是我的javascript

function loaded() 
     { 
      var v = document.getElementById('myVideo'); 
      var r = v.buffered; 
      var total = v.duration; 
      var current=v.currentTime; 
      var start = r.start(0); 
        var end = r.end(0); 
      var downloadPercent= Math.round((end/total)*100) 
      $("#loadProgress").css('width',downloadPercent+ '%'); 

        if(downloadPercent==100){ 
       $("#preloaderWrapper").fadeOut(function(){ 
       document.getElementById('myVideo').play(); 
       clearInterval(ratoteLoad); 
       $(this).remove();     
        });    
      }  

     } 

      $('#myVideo').bind('progress', function() 
      { 
       loaded(); 
      });

有什麼想法嗎？謝謝

來源

2011-12-03 Bahadır

試試這個：

myVideoTag = document.getElementById('video'); 
myVideoTag.addEventListener('progress', function(e) { 
    var percent = null; 
    // FF4+, Chrome 
    if (myVideoTag && myVideoTag.buffered && myVideoTag.buffered.length > 0 && myVideoTag.buffered.end && myVideoTag.duration) { 
     percent = myVideoTag.buffered.end(0)/myVideoTag.duration; 
    } 
    // Some browsers (e.g., FF3.6 and Safari 5) cannot calculate target.bufferered.end() 
    // to be anything other than 0. If the byte count is available we use this instead. 
    // Browsers that support the else if do not seem to have the bufferedBytes value and 
    // should skip to there. Tested in Safari 5, Webkit head, FF3.6, Chrome 6, IE 7/8. 
    else if (myVideoTag && myVideoTag.bytesTotal != undefined && myVideoTag.bytesTotal > 0 && myVideoTag.bufferedBytes != undefined) { 
     percent = myVideoTag.bufferedBytes/myVideoTag.bytesTotal; 
    } 

    if (percent !== null) { 
     percent = 100 * Math.min(1, Math.max(0, percent)); 

     // ... do something with var percent here (e.g. update the progress bar) 

    } 

}, false);

...評論從mediaelement.js複製代碼很好，但調整更容易顯示在這裏。我省略了Firefox 3.0的代碼，因爲它不太相關。在所有的主流瀏覽器工作正常

PS：THX約翰代爾的MEJS - 偉大的東西;）

來源

2011-12-05 09:06:03

謝謝你的評論，我想這一點，但似乎仍然相同，我... –

您的評論說測試在IE 7/8中，但我想測試會失敗，因爲這些瀏覽器不使用'addEventListener' – AlienWebguy

@AlienWebguy：對我很恥辱 - 那是真的！我省略了'myVideoTag.attachEvent（'progress'，function（e）{...}）的額外例程;'' –

鉻html5視頻buffered.end事件

回答

相關問題