javascript - 自定义警报框不是 jquery 在哪里？

Question

我试图找到一些自定义警报框，它们不使用一些库，例如：jQuery、Prototype 等。我想获得简单的示例，它具有丰富的 UI 作为 jQuery，但不使用它。

我试过用谷歌搜索，但找到了一大群 jQuery 样本......我不需要它。也许您在网站上有一些带有纯 js 示例的链接，这些示例不使用某些库？

因为我想获得具有丰富 UI 的简单示例，这些示例不基于以下库：jQuery、Prototype.js、Enyo 等

谢谢！

Answer 1

我认为这些链接会帮助你：

1. http://www.codeproject.com/Articles/28812/Custom-Alert-Boxes-using-JavaScript-and-the-DOM

2. http://www.gayadesign.com/diy/customize-the-default-alert-function-of-javascript/

3. http://www.scriptiny.com/2008/04/custom-javascript-dialog-boxes/

Answer 2

这不是很困难。基本上你所要做的就是附加一些东西来覆盖整个屏幕和一些东西来显示内容到正文并正确定位它们并将事件侦听器附加到正确的元素以在正确的时间将其删除。所有（嗯，大部分）定位和样式都可以用 CSS 完成。例如，要将事物定位为覆盖整个屏幕，您可以使用以下 CSS：

position: fixed;
left: 0;
right: 0;
top: 0;
bottom: 0;

你甚至可能想让它变得有点半透明，这样更容易判断对话框是模态的：

background: rgba(0, 0, 0, 0.2);

尝试一个小例子。