帶有NO控件的iPad html5視頻？

這已經讓我整天都在想我，但我不確定如何在沒有原生控件的情況下讓html5視頻播放器工作。帶有NO控件的iPad html5視頻？

我不想包含任何控件，但如果我不包含它們，視頻似乎不想播放，即使我在下面添加一些javascript以嘗試強制播放它，它也適用於iPhone和多個瀏覽器，但不是iPad，這是奇怪的，任何想法？

這裏有一些標記，如果有幫助！

<video src="video.mp4" id="video" poster="image.jpg" onclick="this.play();"/></video> 

$('#video').click(function(){ 
    document.getElementById('video').play(); 
});

來源

2012-06-01 user1370288

iOS不支持視頻標籤的autoplay屬性。它也會出現，你不能使用jQuery綁定視頻元素的點擊事件（請參閱fiddle）。

一種解決方法是在視頻元件來定位隱形DIV並結合，其播放視頻到點擊（見fiddle）：

HTML：

<div id="video-overlay"></div> 
<video id="video" width="400" height="300"> 
     <source id='mp4' 
     src="http://media.w3.org/2010/05/sintel/trailer.mp4" 
     type='video/mp4'> 
     <source id='webm' 
     src="http://media.w3.org/2010/05/sintel/trailer.webm" 
     type='video/webm'> 
     <source id='ogv' 
     src="http://media.w3.org/2010/05/sintel/trailer.ogv" 
     type='video/ogg'> 
</video>

CSS：

#video { border: 1px solid black; } 
#video-overlay { position: absolute; width: 400px; height: 300px; z-index: 999; }

jQuery：

$('#video-overlay').click(function(){ 
    document.getElementById('video').play(); 
});

來源

2012-06-01 23:11:46

感謝您的明確回覆，我會給這個旋轉和回來後;）） – user1370288

工作的魅力。 – user1370288

截至目前，iOS 6的支持在某些設備上的autoplay元件。

查詢http://www.longtailvideo.com/html5/autoloop/僅供參考。

來源

2013-09-13 09:04:19 fseydel

在設計上不能自動播放視頻，但它足夠簡單的播放開始後以刪除控件，我猜是你真正想要的效果：

<video id="video" src="video.mp4" poster="image.jpg" preload="auto" onplaying="this.controls=false"/></video>

來源

2014-08-30 19:57:53 Doin

我不確定'preload =「auto」'是否在iPad上做了任何事情，但它沒有傷害。 – Doin

這解決了我的問題！ –

這對我有用，我甚至可以使用jQuery動態地將'onplaying' prop添加到標籤，如果有人正在使用一些隱藏'video'標籤的視頻播放器插件 –

我能做的最好的只要用戶觸摸屏幕進行任何操作，即使向下滾動頁面，也會播放視頻。

function playVideoNow(e) 
{ 
    document.getElementById('video').play(); 
    document.removeEventListener('touchstart', playVideoNow); 
} 

document.addEventListener('touchstart', playVideoNow, false);

來源

2015-02-26 00:44:11

我用這個

<video id="video" controls=「true」 width="300" height="250" poster="gray30x25.gif" autoplay onplaying="this.controls=false">

controls=「true」 - 使得它在iPad上

autoplay工作 - 使得它自動播放，除了移動

onplaying="this.controls=false" - 刪除控制播放

時它自動播放o n筆記本電腦，並在iPad上工作！
謝謝Doin

來源

2016-07-15 00:08:42 egandesign

帶有NO控件的iPad html5視頻？

回答

相關問題