2012-06-18 30 views
1
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  
</head> 

<body> 
<video id="my_video_1" class="video-js vjs-default-skin" controls 
preload="auto" width="300" height="170" poster="../images/audi/audi_poster.png" 
data-setup="{}"> 
<source src="../videos/audi/audi.mp4" type='video/mp4'> 
<source src="../videos/audi/audi.ogg" type='video/ogg'> 
<source src="../videos/audi/audi.webm" type='video/webm'> 

</video> 
</body> 
</html> 

對於上述代碼,該文件在Google Chrome上播放時沒有任何錯誤,但在Firefox和IE上播放時沒有任何錯誤。對於Firefox和IE,mp4文件不起作用

我不知道我錯在哪裏.. PLease幫助..我真的需要解決這個問題。 請求幫助

該網站在goddady服務器上運行。我沒有使用任何數據庫來存儲視頻文件,也沒有任何PHP編程..我只需將視頻上傳到服務器n的html文件中... 它是一個非常簡單的頁面,我希望所有視頻都能播放3瀏覽器..

+2

什麼是您使用的** Mozilla Firefox **和** Internet Explorer **的版本?而且,它必須以'<!DOCTYPE html>'開始,而不是使用你正在使用的那個。 –

回答

1

HTML5 videoaudio標記支持目前不是最友好的。

首先你DOCTYPE應該是<!DOCTYPE html>正如在評論中提到的。然後有幾件事要考慮:

  1. Firefox不支持MP4播放,Opera也不支持。您需要將視頻從MP4轉換爲WEBM或OGG格式,並將它們放入與MP4相同的目錄中以適合您的示例。
  2. IE8及以下根本不支持<video>標籤,我猜這是您的IE版本的問題。 IE9確實支持MP4播放。

有一個項目我目前的工作在這裏的一個很好的戲後的一些問題我也碰到過:

  1. iOS設備(和移動設備一般)不真的很喜歡這個標籤(特別是內聯),在播放了一段時間之後,我直接鏈接到MP4視頻,現在它在默認播放器中打開。
  2. 谷歌瀏覽器或IE9目前還不支持全屏按鈕,但Safari支持。未檢查FF或Opera,請參見下文。
  3. 避免用戶上傳3個不同文件的需要。我爲FF和Opera添加了Flash後備(Flowplayer)(以及任何不支持MP4 <video>播放的瀏覽器)。我可以在服務器上創建WEBM或OGG文件,但這對IE8等較老的瀏覽器也有幫助。這裏是一個的JavaScript片斷如何檢查MP4播放支持:

    var flashaudioplayer=false; 
    var flashvideoplayer=false; 
    
    // Check if browser supports HTML5 native mp3/mp4 playback 
    var audioTag = document.createElement('audio'); 
    var videoTag = document.createElement('video'); 
    if (!(!!(audioTag.canPlayType) && ("no" != audioTag.canPlayType("audio/mpeg")) && ("" != audioTag.canPlayType("audio/mpeg")))) { 
    flashaudioplayer=true; 
    
    } 
    if (!(!!(videoTag.canPlayType) && ("no" != videoTag.canPlayType("video/mp4")) && ("" != videoTag.canPlayType("video/mp4")))) { 
    flashvideoplayer=true; 
    } 
    
  4. 您還可以找到與在<audio>標籤支持MP3播放同樣的問題,的Flowplayer也有一種方法來播放MP3文件,所以這是閃回後備的不錯選擇。

+0

您不需要自己檢測MP4支持 - 只需在MP4''後面添加Flash播放器_inside_'

+0

@Kaivosukeltaja我在玩移動設備時遇到了一些問題。但是,你是對的。 –

+0

即使我也有3種格式,文件不在FF或IE中播放? 如果我轉換爲Flash文件 - audi.swf,它會在所有三種瀏覽器中播放 –

相關問題