HTML頁面原生VIDEO標簽隱藏下載按鈕功能
發(fā)布時間：2018-05-04 16:07:18 作者：佚名 
我要評論
我要評論這篇文章主要介紹了HTML頁面原生VIDEO標簽隱藏下載按鈕功能，非常不錯，具有參考借鑒價值，需要的朋友參考下吧
在寫web項目的時候，遇到簡介頁面有一個單獨的簡介視頻，只有這一個短短的視頻所以沒有使用任何video組件，所以運用原生video標簽就想解決問題。
雖然簡介視頻是非付費的，但也不希望會有下載按鈕或者可以視頻另存為，所以找到一個可以看上去沒有下載功能的方法，做一下筆記。
想要隱藏以上下載按鈕，三個樣式就可以了，不廢話直接貼代碼：
video::-internal-media-controls-download-button {
display:none;
}
video::-webkit-media-controls-enclosure {
overflow:hidden;
}
video::-webkit-media-controls-panel {
width: calc(100% + 50px);
}
說白了就是把下載按鈕移動到視窗外面，但是這些CSS找了好久啊??！
這種方法并不能真正阻止視頻的下載，“有心”的用戶還是可以在緩存文件里找到加載過的視頻文件的，所以就像標題寫的一樣，只是隱藏。
真正的阻止視頻的下載還是需要通過服務器端對視頻地址進行加密驗證。
總結
以上所述是小編給大家介紹的HTML頁面原生VIDEO標簽隱藏下載按鈕功能，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持！
相關文章
- 這篇文章主要介紹了詳解Html5中video標簽那些屬性和方法，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起2019-07-01
HTML5的Video標簽有部分MP4無法播放的問題解析（多圖）
這篇文章主要介紹了HTML5的Video標簽有部分MP4無法播放的問題。通過代碼展示了設置的過程，具體操作步驟大家可查看下文的詳細講解，感興趣的小伙伴們可以參考一下。2017-08-18- 這篇文章主要給大家介紹了關于解決html5中video標簽無法播放mp4問題的辦法，文中介紹的非常詳細，相信會對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面來2017-05-07
- 使用HTML5時就應該考慮包括桌面以及移動端的瀏覽器兼容問題,特別是視頻方面瀏覽器對解碼的支持會有所不同,所以下面就來分享一個HTML5的video標簽的瀏覽器兼容性增強方案分2016-05-19
HTML5 video標簽（播放器）學習筆記（二）:播放控制
這篇文章主要介紹了HTML5 video標簽（播放器）學習筆記（二）:播放控制,本文講解了獲取影片總時長、播放、暫停、獲取影片的播放時間和設置播放點、音量的獲取和設置等內容,2015-04-24HTML5 video標簽（播放器）學習筆記（一）:使用入門
這篇文章主要介紹了HTML5 video標簽（播放器）學習筆記（一）:使用入門,本文講解了使用標簽、比如播放視頻的路徑、是否顯示控制條、讓視頻自動播放或自動加載、讓播放器規(guī)2015-04-24- 這篇文章主要介紹了HTML5 Video標簽的屬性、方法和事件匯總介紹,本文講解了2015-04-24
- HTML video 適用于HTML 5+，用于定義在線觀看的視頻流媒體，這里簡單介紹下， 方便需要的朋友2014-02-03
- html5 video標簽本身有下載功能但是在video區(qū)域內，點擊右鍵可以將“視頻另存為”下面是屏蔽右鍵視頻另存為的js代碼，有此需求的朋友不要錯過2013-11-12
html5視頻媒體標簽video的使用方法及完整參數(shù)說明詳解
這篇文章主要介紹了html5視頻媒體標簽video的使用方法及完整參數(shù)說明詳解,需要的朋友可以參考下2019-09-27