自定义对话框兴奋

当然我们必须有一个自定义对话框！这有多有趣？

我为那些感兴趣的人观看了这个视频，并且能够相当轻松地处理该过程。

是如何完成的

首先，我们在 html 中创建一个结构。
当背景弹出时，我们可以使用覆盖层来遮挡背景。我们还需要创建一个里面有更多元素的盒子。这是一种方法：

另请注意添加了 onclick 事件的按钮。

---

有趣的部分

使用 CSS 添加样式来自定义您的新框：

创建我自己的对话框是非常令人兴奋的。我喜欢摆弄按钮、颜色和形状。我很高兴我花时间来解决这个问题。这是一个有趣的迷你项目！

---

设置功能

1. 创建一个自定义函数，在 JavaScript 中呈现 onclick 对话框。
2. 创建变量来定义大小并使用 ID 从 DOM 访问元素。
3. 一旦我们抓取了盒子元素，我们就可以将弹出的对话框居中，以窗口宽度为参考，除以2。

此对话框有三个区域，但您可以根据需要添加或减少内容。这里真正的障碍是功能。

• 通过在每个唯一 ID 上使用 .innerHTML 动态地将信息添加到框中。
• this.render 将渲染点击信息。
• alert.render 在 onclick 时被调用，从而触发 customAlert 函数。

this.ok 函数确保当单击“弹出”框中的按钮时删除覆盖层和对话框。我们绝对需要那个。这是通过将两者的样式设置为 none 来完成的。

---

太棒了 - 尝试一下

我真的很高兴这样做 - 并且再次熬夜。 XD

以上是自定义对话框兴奋的详细内容。更多信息请关注PHP中文网其他相关文章！