HTML5，视频和Javascript：使用视频时间轴控制页面行为

Question

I'm having the following problem: i have to show a video inside a page, but it needs to alternate with page content. Everytime the video stops playing, i have to show a div or something. After a few seconds, that div goes away and the video starts playing again. Alternating between normal content and video.

Is this possible with HTML5 and JS? Any ideas on how to do it?

Answer 1

Consider implementing Popcorn.js . It's part of Mozilla's Popcorn project.

The demo on the front page shows a div with changing HTML content depending on the time code of the video.

Popcorn.js is an HTML5 media framework written in JavaScript for filmmakers, web developers, and anyone who wants to create time-based interactive media on the web

Answer 2

在视频停止播放时绑定一个事件（ addEventListener( "ended", function(){ ... }, false) ）以显示div，启动一个计时器，之后div隐藏并重新开始播放视频。