2

当我使用这个脚本时：

<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 事件吗？

问候

托尔斯滕

4

1 回答 1

4

此脚本将允许您触发对<video>元素的 Play 事件的操作，该操作（在这种情况下）更改 a 的背景颜色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>
于 2013-03-22T17:12:42.373 回答