Javascript HTML5：在带有控件的视频上放置画布

我想在HTML5视频上画画。为此，我尝试在HTML5视频元素上放置画布

但是，当我将画布放在视频元素上时，视频控件不起作用。自从canvas获得所有鼠标悬停和单击事件以来。是否有办法将事件委派给视频控件或在其他地方显示控件

---

任何帮助/想法都很好。

您可以在画布中捕获单击事件并计算它们的位置。基于此，您可以大致确定目标控件，并让视频改变您自己。
我的意思是这样的：

canvas.onclick = function(e){
    if(isOverPauseBtn(e))
        video.pause();
    //.. and so on
}

---

您应该实现自己的控件（或使用现有控件集，如）

---

您可以阅读我对这个问题的回答：

增加画布的z索引<代码>z指数=10 将视频放在画布下。 画布高度=整个视频的高度-视频控件的高度

---

您只能使用画布覆盖视频部分，如果将鼠标悬停在画布的底部，您将获得控件

也许您需要另一种方式：在画布上绘制视频，并在画布上使用新奇的内容和交互增强视频？