HTML5畫布和音頻跨瀏覽器兼容性

我正在做畫布遊戲，假定用戶使用的瀏覽器與本機帆布支持爲（沒有IE < 9個腳本或類似的）。如果用戶沒有下載最新版本的瀏覽器，則會顯示一條消息，其中包含鏈接以下載最新版本的瀏覽器。這是通過一個消息顯示如下的<帆布>內容：

 
    <canvas> 
     Error message (upgrade... safer, faster, better... free... 
         ...play this awesome game... getfirefox.com) 
    </canvas>

問題

它是安全的假設，任何瀏覽器支持<帆布>標籤支持<音頻>標籤？或者我需要添加一個額外的錯誤信息，以顯示兩個信息的風險？我擔心的是他們的屏幕上會出現錯誤信息，以防他們對音頻沒有本地支持，但是他們對畫布有幫助。

據我所知，所有最新版本的IE，Firefox，Chrome，Safari和Opera都支持canvas和audio，但我不確定移動瀏覽器和「中間版本」等等。其他方法的想法也讚賞！

預先感謝您！

最好的問候，
安東

來源

2011-06-21 Anton

瀏覽器支持<canvas>但不<audio>（根據When can I use...）：

Safari瀏覽器3.2
的Opera Mini 5.0-6.0
的Opera Mobile 10
Andr OID瀏覽器2.1-2.2

替代方法

檢測功能的JavaScript：

<audio>：return !!document.createElement('audio').canPlayType;
<canvas>：return !!document.createElement('canvas').getContext;

和DIS相應地播放消息。

查看The All-In-One Almost-Alphabetical No-Bullshit Guide To Detecting Everything獲取完整列表。如果您需要一個用於HTML5功能檢測的全功能庫，請嘗試Modernizr。

來源

2011-06-21 03:15:04 melhosseiny

哇，非常感謝！增加了3個偉大的書籤。然後它似乎是一個非常小的問題。我想我會用JavaScript來檢測你所說的功能，如果有畫布但沒有音頻，我可以爲Safari，Opera Mobile（Mini根據opera.com缺少支持）和Android顯示自定義消息。雖然我不想製作特殊的解決方案，但我懷疑目前支持這兩種元素的瀏覽器會停止支持其中的一種。換句話說，可能沒有新的瀏覽器將被添加到這個列表中。你認爲這是安全的嗎？再次感謝您！ – Anton

除非您的消息依賴於這些瀏覽器，否則您關心什麼？這是JS功能檢測的重點，您擔心_features_而不是_browsers_。也就是說，這個假設的安全性取決於我可以使用的時間有多精確/完整......表是無論您是使用畫布文本API還是使用的音頻格式（也可以檢測到）。 – melhosseiny

的確如此。我想盲目信任他們不是一個好主意。至於API和音頻格式，我還不完全確定將要在遊戲中實施什麼，所以我還不知道。我對瀏覽器的看法是，在我們的目標羣體中，尚未升級瀏覽器以支持HTML5的人可能需要非常小心的指導，只有一個可以輕鬆識別的可點擊鏈接。否則，我的經驗告訴我，他們中的許多人會放棄。無論如何，非常感謝你的回覆，你肯定幫助我走上正軌！謝謝。 – Anton

HTML5畫布和音頻跨瀏覽器兼容性

回答

相關問題