登录  /  注册
首页 > web前端 > html教程 > 正文

HTML页面原生VIDEO标签隐藏下载按钮功能

不言
发布： 2018-05-05 10:11:15
原创
2951人浏览过

这篇文章主要介绍了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找了好久啊！！

这种方法并不能真正阻止视频的下载，“有心”的用户还是可以在缓存文件里找到加载过的视频文件的，所以就像标题写的一样，只是隐藏。

真正的阻止视频的下载还是需要通过服务器端对视频地址进行加密验证。

相关推荐：

HTML5 video视频字幕的使用和制作方法

HTML5触摸事件实现移动端简易进度条的实现方法


以上就是HTML页面原生VIDEO标签隐藏下载按钮功能的详细内容，更多请关注php中文网其它相关文章！

相关标签：
VIDEO HTML 标签
来源：php中文网
上一篇：HTML5触摸事件实现移动端简易进度条的实现方法 下一篇：HTML5声音录制/播放功能的实现代码
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn
作者最新文章
最新问题
session_variables 表在 performance_schema 中不存在 在将MySQL升级到5.7.8-rc版本并登录服务器后，我遇到了以下错误：表'performance_schema.session_variables'不存在我找不到任何解决方案。...
P粉504920992来自于2023-09-22 13:52:07
0 2 583
Laravel按价格排序，带有特殊价格条件 我有一个带有以下列（价格，特价，是否特价）的表。+-------+------+-----------------+--------------+---------+|id|pri...
P粉030479054来自于2023-09-22 13:06:46
0 1 552
renderHook中waitForNextUpdate的替代方案 我已经更新了Testing-library，但我在这种情况下很难找到waitForNextUpdate的替代方法（在react-testing-libraryv13中不再可用htt...
P粉198670603来自于2023-09-22 11:40:09
0 1 450
为什么我无法在Next JS应用中使用CSS文件？ 我一直在一个使用NextJS进行网站设计的项目中工作，想要使用CSS文件进行组件设计，但为什么我无法在我的组件中导入呢？在NextJS应用中是否可能只能使用模块化的CSS文件？我尝...
P粉904191507来自于2023-09-22 10:58:43
0 1 440
如何将函数传递给动态创建的 href？ 我想把一个函数传递给我的a标签链接的href属性，但无论我尝试什么都不起作用。它要么导致404页面，要么根本无法点击。我做错了什么？这个是不可点击的<body><...
P粉571233520来自于2023-09-22 09:37:55
0 1 556
getFirstHalf函数返回结果时出现问题 正在开发一个函数，该函数接受一个数组并返回该数组的前一半，但在返回之前，它会调用自身，直到数组的长度为1：constgetFirstHalf=function(array){con...
P粉311617763来自于2023-09-22 08:49:09
0 1 324
使用React.StrictMode和fabric.js的Canvas实例进行重渲染 我正在创建一个织物画布和按钮，这些按钮实例化的形状应该是可选择的。我不明白为什么在以下情况下我的组件会被重新渲染两次。因此，我的织物形状无法选择。然而，当我从我的index.tsx...
P粉659378577来自于2023-09-21 23:48:52
0 1 386
PHP存储数据库效率的问题 程序一：for($i=0;$<100;$++){连接数据库；执行select提前一个值；断开数据库连接；连接数据库；执行一次updata 存储数据；断开数据库连接；}程序执行...
八哥来自于2023-09-22 22:46:18
0 0 243
React Native自定义TextInput不响应onChangeText事件 我想在ReactNative中创建和使用一个CustomTextInput。我已经按照下面的代码创建了它，但是CustomTextInput中的onChangeText属性没有正常...
P粉743288436来自于2023-09-21 22:59:27
0 2 275
检查一个PHP字符串是否仅由整数组成 我正在编写PHP代码来验证用户输入的一些数据，其中之一是整数，我使用$_REQUEST["age"]来获取它，当我用gettype($_REQUEST[&quo...
P粉788765679来自于2023-09-21 21:52:44
0 2 267
相关专题
更多>
热门推荐
热门教程
更多>
相关教程
热门推荐
最新课程
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 意见反馈 讲师合作 广告合作 技术文章
php中文网：公益在线php培训，帮助PHP学习者快速成长！
关注服务号 技术交流群
app下载
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习
PHP中文网抖音号
发现有趣的

Copyright 2014-2023 //m.sbmmt.com/ All Rights Reserved | 苏州跃动光标网络科技有限公司 | 苏ICP备2020058653号-1

 | 本站CDN由 数掘科技 提供

登录PHP中文网，和优秀的人一起学习！
全站2000+教程免费学
微信扫码登录

  • 精品班

  • 立即咨询

  • 微信沟通

  • QQ群

  • 优惠券

  • 返回顶部