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 を変更したい (背景を薄暗くする) 再生イベントでその作業を行うことはできますか?

よろしく

トルステン

4

1 に答える 1

4

このスクリプトを使用すると、要素のPlayイベントでアクションをトリガーし<video>て(この場合)の背景色を変更divできますが、同じメソッドを使用して1つ以上の要素のクラスなどを調整(または不透明度を適用)できます。中間層へ)。サンプルはイベントをオフにするので、それは1回限りのことですが、再生、一時停止、終了、エラーなどをトラップするイベントを追加すると、動作をかなりきめ細かく制御できます。

<!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 に答える