在Chrome 55中，禁止显示HTML 5视频的下载按钮
在Chrome 55中，禁止显示HTML 5视频的下载按钮
提问于 2016-12-13 15:38:27
我在Chrome55上得到了这个带有<video>标签的下载按钮，但在Chrome54上却没有：
我怎样才能移除它，让别人看不到Chrome55中的下载按钮？
我已经使用<video>标签在我的网页上嵌入了这个视频。所以，我需要一些代码来删除这个下载选项。
下面是我当前的代码：
<video width="512" height="380" controls>
<source data-src="mov_bbb.ogg" type="video/mp4">
</video>回答 6
Stack Overflow用户
回答已采纳
发布于 2016-12-14 14:52:31
这就是解决方案(来自this post)
video::-internal-media-controls-download-button {
display:none;
}
video::-webkit-media-controls-enclosure {
overflow:hidden;
}
video::-webkit-media-controls-panel {
width: calc(100% + 30px); /* Adjust as needed */
}更新2：@Remo提供的新解决方案
<video width="512" height="380" controls controlsList="nodownload">
<source data-src="mov_bbb.ogg" type="video/mp4">
</video>Stack Overflow用户
发布于 2017-04-20 16:04:53
自从上一个答案发布在这里后，谷歌增加了一项新功能。现在可以添加controlList属性，如下所示：
<video width="512" height="380" controls controlsList="nodownload">
<source data-src="mov_bbb.ogg" type="video/mp4">
</video>你可以在这里找到controllist属性的所有选项：
https://developers.google.com/web/updates/2017/03/chrome-58-media-updates#controlslist
Stack Overflow用户
发布于 2016-12-23 21:47:14
当使用HTML5音频时，这可以隐藏Chrome上的下载按钮。
#aPlayer > audio { width: 100% }
/* Chrome 29+ */
@media screen and (-webkit-min-device-pixel-ratio:0)
and (min-resolution:.001dpcm) {
/* HIDE DOWNLOAD AUDIO BUTTON */
#aPlayer {
overflow: hidden;width: 390px;
}
#aPlayer > audio {
width: 420px;
}
}
/* Chrome 22-28 */
@media screen and(-webkit-min-device-pixel-ratio:0) {
#aPlayer {
overflow: hidden;width: 390px;
}
#aPlayer > audio { width: 420px; }
}<div id="aPlayer">
<audio autoplay="autoplay" controls="controls">
<source src="http://www.stephaniequinn.com/Music/Commercial%20DEMO%20-%2012.mp3" type="audio/mpeg" />
</audio>
</div>
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/41115801
复制相关文章
相似问题