Javascript 在画布上覆盖一幅画

我正在用html5制作一个演示，这就是我想要做的：

我已经有一个元素作为绘图板，一个人在上面随机绘图

现在我想：

• 在画布顶部，临时显示（覆盖）一张小图片和一些文本消息几秒钟。然后淡出

• 覆盖不应阻止用户继续绘制

• 重叠的图片应清晰地消失，而不是覆盖下面的图纸。或阻止鼠标操作

我该怎么做

---

非常感谢你的帮助

通过读取鼠标坐标来绘制，如果鼠标按钮按下，对吗？然后你所要做的就是继续从鼠标中读取这些值

---

如果您只是在canvas元素中侦听鼠标事件，我可以看到，如果您将任何元素放置在canvas元素之上，就会出现问题。如果是这样，您将不得不切换到侦听完整文档上的鼠标事件（

document.addEventListener（'mousemove'，…）

等）。

是否可以在画布上相互重叠，然后使顶层透明，并将鼠标动作传递到下层，您可以将canvas元素视为任意html元素。Ie您可以更改其css样式属性，例如

top

，

left

，

不透明度

，

z-index

，等等。传递鼠标操作；您可以全局（在文档级别）侦听它们，然后调用可能影响正确画布的适当函数。