# web-alert

**Repository Path**: tzboy/web-alert

## Basic Information

- **Project Name**: web-alert
- **Description**: 基于DOM的JS 弹框工具
- **Primary Language**: JavaScript
- **License**: Apache-2.0
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 8
- **Forks**: 0
- **Created**: 2020-03-11
- **Last Updated**: 2020-12-19

## Categories & Tags

**Categories**: webui

**Tags**: None

## README

 **WEB-ALERT** 

### 截图
 **更多颜色主题搭配 等你来创造** 

-  showContent:
![showContent](https://images.gitee.com/uploads/images/2020/0311/135205_20d42f29_811704.png "屏幕截图.png")

-  showToast:
![showToast](https://images.gitee.com/uploads/images/2020/0311/140156_94cc04b6_811704.png "屏幕截图.png")

-  showLoading:
![showLoading](https://images.gitee.com/uploads/images/2020/0311/140222_49fc3e82_811704.png "屏幕截图.png")

### Demo
[演示地址](http://115.28.70.16:8081/example.html)

### 说明

```
###### 内容弹框(参数选填)
wa.showContent({
    "title":"这是一个弹框", /* 标题 */
    "content":"这里是内容", /* 内容 */
    "mask":"0.6", /* 蒙层透明度 */
    "titleBgc":"#fff, /* 标题背景颜色 */
    "titleColor":"#3e3e3e", /* 标题字体颜色 */
    "confimText":"确定", /* 确定按钮 字样 */
    "confimBgc":"#3e3e3e", /* 确定按钮 背景颜色 */
    "confimColor":"#3e3e3e", /* 确定按钮 字体颜色 */
    "cancelText":"关闭", /* 取消按钮 字样 */
    "cancelBgc":"#bfbfbf", /* 取消按钮 背景颜色 */
    "cancelColor":"#808080", /* 取消按钮 字体颜色 */
    "showCancel":false, /* 是否显示 取消按钮 */
    "width":"500px", /* 宽度设置 */
    "height":"300px", /* 高度设置 */
    "done":function(){}, /* 完成回调 */
    "confim":function(){},	/* 点击确定按钮 */
    "cencel":function(){},	/* 点击取消按钮 */
});
```

```
###### 提示框(参数选填)
wa.showToast({
    "msg":"这是一个提示消息", /* 提示信息 */
    "icon":"warning", /* icon（warning|success|error） */
    "mask":"1", /* 透明度 */
    "theme":"blue", /* 主题(blue|green|orange|red) */
    "position":'center', /* 位置设置(center|leftTop|rightTop) */
    "done":function(){}, /* 完成回调 */
});
```

```
###### 加载框(参数选填)
wa.showLoading({
    "position":'centerTop', /* 位置设置(centerTop) */
    "done":function(){}, /* 完成回调 */
});
```

```
###### 关闭加载框
wa.hideLoading(key); /* showLoading的回调方法的done 携带的key; */
```

```
###### 主动关闭某个弹框
wa.close(key);     /* 回调方法的done|confim|cencel 携带的key; */
```