当我使用这个脚本时:
<script>
myVid=document.getElementById("video1");
myVid.oncanplay=alert("Can start playing video");
</script>
http://www.w3schools.com/tags/tryit.asp?filename=tryhtml5_av_event_canplay
视频可以播放时会弹出一个窗口。
我想在视频开始播放时更改 div 的 css(使背景变暗) 我可以通过 play 事件来完成这项工作吗？
问候
托斯顿
最佳答案
此脚本将允许您在 <video> 的 Play 事件上触发操作(在本例中)更改 div 的背景颜色的元素，但您可以使用相同的方法来调整一个或多个元素的类等(或将不透明度应用于中间层)。
该示例关闭了事件，因此这是一次性的事情，但是添加事件来捕获播放、暂停、结束、错误等，您可以对行为进行相当精细的控制。
<!DOCTYPE HTML>
<html>
<body style="background-color: white">
<div id="dimMe" style="background-color:blue">
<video id="video" autobuffer controls muted width=240 height=200>
<source src="http://jcath-drg.s3.amazonaws.com/BigBuck.m4v">
</source>
</video>
</div>
<script>
document.getElementById("video").addEventListener('play', dimBack, false);
function dimBack() {
this.removeEventListener('play', dimBack, false);
document.getElementById("dimMe").style.backgroundColor="green";
}
</script>
</body>
</html>
关于javascript - 播放中的 HTML5 视频火灾事件(暗淡页面)，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/15568357/