javascript - 如何在 HTML5 视频加载完成后让文本消失?

标签 javascript css html video

标题几乎说明了一切。我正在尝试在 HTML5 视频上添加一些显示“视频正在加载”的文本和 75% 的不透明背景,一旦它完全加载,我希望文本和背景消失。我该怎么做?

感谢您付出的时间和精力! 我正在尝试执行此操作的页面是 jeffarries.com/videos .如果需要可以提供代码。


dup 链接指向一个试图获取 HTML5 视频持续时间的帖子,我试图在 HTML5 视频完全加载到浏览器中时让 JavaScript 更改 css 属性。

最佳答案

我最终使用这段 JavaScript 代码通过将 CSS display: block; 更改为 display: none; 来隐藏我的 id 为“video_cover”的 HTML 元素,当 HTML5 视频元素“myVideo”触发 canplaythrough:

<script>
var vid = document.getElementById("myVideo");
vid.oncanplaythrough = function() {
    var e = document.getElementById("video_cover");
       e.style.display = 'none'
};
</script> 

资源: W3Schools canplaythrough JavaScript 事件。

抱歉,如果我的 JavaScript 术语不好,我只是在学习!


再次感谢@Quantastical 和@Offbeatmammal 的帮助!

关于javascript - 如何在 HTML5 视频加载完成后让文本消失?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35709488/

相关文章:

javascript - React/Redux - 从 Url ID 获取详细信息

javascript - Keystonejs:自定义名称到管理 UI 的默认列

JavaScript 原型(prototype)属性

Javascript:在脚本运行之前不要完成页面加载

html - 什么是 DOM 级别?

javascript - mootools 和 nodejs

jquery - 在 bootstrap 幻灯片中抓取 Twitter 提要

html - 是什么造成了这种间距?

html - 在图像上放置文本

java - 创建将在 Web 浏览器中显示的 Java 小程序