javascript - HTML5 视频 OnComplete 下一张幻灯片 Reveal.js

Question

有谁知道是否可以将 HTML5 视频与演示文稿 javascript Reveal.js 连接，这样如果我在一张幻灯片上播放视频，当该视频播放完毕时，它会自动进入下一张幻灯片？

Reveal.js 有自己的事件处理器

Reveal.addEventListener( 'customevent', function() {
    console.log( '"customevent" has fired' );
} );

但是我找不到任何关于幻灯片中的元素是否可以触发 nextSlide 功能的具体文档。

Answer 1

所以...这是解决方案，或者至少是我想出的答案。

您有一系列充当幻灯片的部分，其中一张幻灯片中有一个视频。

在该幻灯片中，您需要添加以下脚本:

<script>
     var video = document.getElementById("myVideo");
     video.onended = function(e) {
          Reveal.next();
     }
</script>

确保使用 ID 标签标记您的视频元素，然后在此脚本中调用该 ID 标签。 Reveal.next() 是内置 API 的一部分，它将自动进行幻灯片放映。