Javascript 在html上显示画布对象

所以我在练习javascript，我制作了一个以动画为背景的乐透游戏。这就是它的样子：

我想知道是否有可能使在背景中弹跳的球越过

div

，其中

标题、随机数和按钮

。因此，基本上球在

div

前面反弹，而不是在它后面反弹

以下是代码的链接：

提前谢谢你们

编辑： 添加id为“myBallCanvas”的第二个画布

<canvas id="myBallCanvas"></canvas> 

最后，更改javascript，以便选择新画布

var canvas = document.querySelector('#myBallCanvas');

并更改所有#frame，#frame2的z索引。。。将选择器设置为0

基本上，较低的z索引元素将被放置在较高索引元素之后。请注意，要对其使用z索引的任何元素都必须具有指定的位置属性（固定、绝对或相对）

---

哦，下一次，你应该在你的主要帖子中添加一个代码链接。如果你只把它放在我的回答中，其他人不会看到它，请帮助演示你的问题。我如何在

css

和制作balls对象的

脚本之间建立连接？因为在
html
文件中，我添加了类似
的脚本，但是我如何才能将类添加到球中呢？如果需要更详细的响应，您应该在这里发布所有代码。无论如何，我已经编辑了我的答案。您不需要连接css和javascript。您可以将其视为修改htmlHere is my code的css和脚本文件。两个文件都已上载。我创造它们的方式和你说的不同。我编辑了我的回答问题是现在整个
画布被放在了前面。我的目标是只放球。我用链接编辑了我的帖子
var canvas = document.querySelector('#myBallCanvas');