html5視頻後備忠告（不閃光）

我正在尋找一種創新方式，在幾種情況下用圖像替換HTML5視頻。不想處理閃光燈或類似的東西，使視頻工作......寧願給他們一個形象。html5視頻後備忠告（不閃光）

給他們，如果圖像：

如果桌面瀏覽器不支持HTML5視頻
如果用戶是移動

看似簡單...特別是通過使用Modernizr for css標籤與display:none;如果視頻不支持...所以這裏的警告：HTML5視頻是邊緣到邊緣，並與JavaScrip中心到屏幕我希望圖像具有相同的行爲。

我最初的想法很簡單：海報屬性。適用於iPad和iPhone 3/3gs，但可以在iPhone 4上播放。另外，在IE上不起作用，IE顯然會說「我不知道這是什麼」，甚至不會打擾海報。

我有一個測試在http://kzmnt.com/test/

設立期待您的諮詢！

來源

2011-07-04 technopeasant

出於好奇，爲什麼你不想讓你的視頻在手機上播放？你會考慮移動（平板電腦，智能手機，老廢話，上網本，PSP）？ – sdleihssirhc

該視頻相當大，負責..並採取整個背景。除了iPad對iPhone 4與iPhone 3G/3G之間的行爲差異之外，我認爲用數據計劃與他人沒有選擇觀看的視頻相撞是一種無禮的行爲。 – technopeasant

約1100像素後使用媒體查詢，並用一個圖像替換它使用CSS背景大小設置爲覆蓋！

來源

2011-07-20 07:07:09 technopeasant

您可以檢查是否HTML5視頻與以下支持：

function supports_h264_baseline_video() { 
if (!supports_video()) { return false; } 
var v = document.createElement("video"); 
return v.canPlayType('video/mp4; codecs="avc1.42E01E, mp4a.40.2"'); 
}

至於移動去，請嘗試使用一些媒體查詢。

上面的代碼是從http://diveintohtml5.ep.io/detect.html#video-formats。

來源

2011-07-05 20:14:34

html5視頻後備忠告（不閃光）

回答

相關問題