顯示HTML5視頻控件但不允許用戶更改任何內容？

是否有可能向用戶顯示HTML5視頻播放器的控件，但不允許他們更改任何內容，如搜索視頻的任何部分，更改音量等？顯示HTML5視頻控件但不允許用戶更改任何內容？

來源

2013-06-24 TK123

杜佩？ http://stackoverflow.com/questions/9854252/html5-disable-default-controls –

@NickR不是真的，這只是刪除控件，我想顯示控件，但防止與它交互。 – TK123

一個簡單的方法是將絕對位置放在視頻上方。
您還可以創建自定義視頻控件，例如只顯示時間線，但不允許互動。

來源

2013-06-24 21:10:46 Andy

原生HTML5 <video>元素不允許此行爲。但是，正如Andy所說，你可以自由地提供自己的控制並使其成爲只讀。

查看MediaElementJS，這是一個包裝HTML5視頻並提供可皮膚控件的JavaScript庫。例如，您可以提取source code of the progress bar，並對其進行修改以刪除點擊處理程序。

來源

2013-06-24 21:19:10

有很多方法可以做到這一點。

首先方法是使用video{pointer-events:none;}，其中用戶不能點擊或使用默認控制bar.But這裏用戶也不能播放/暫停video.So，你必須添加播放/暫停按鈕（如我在加片段）。

二方式是here.但是你必須添加進度條和時間。（progressbar）

和三方法是使用圖書館或舒適做這個框架。例如。使用的Youtube嵌入視頻，而不controles.This可以是最好的方式，但您的視頻應該是Youtube.If沒有，把它上傳.. :)

var vid = document.getElementById("vid"); 
 

 
function play() { 
 
    if (vid.paused) 
 
     vid.play(); 
 
    else 
 
     vid.pause(); 
 
}

video{pointer-events:none;}

<div> 
 
<video id="vid" width="320" height="240" controls> 
 
    <source src="http://www.w3schools.com/html/movie.mp4" type="video/mp4"> 
 
    <source src="http://www.w3schools.com/html/movie.ogg" type="video/ogg"> 
 
    Your browser does not support the video tag. 
 
</video> 
 
    </div> 
 
<br> 
 
<button onclick="play()">Play/Pause</button>

來源

2016-12-27 07:07:16 SreYash

顯示HTML5視頻控件但不允許用戶更改任何內容？

回答

相關問題