cute-alert实现自适应弹出框效果代码
代码语言:html
所属分类:弹出层
代码描述:cute-alert实现自适应弹出框效果代码,包括成功提示、错误提示、警告提示、信息提示、确认框提示等样式。
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/bootstrap.3.3.4.css"> <link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/cute-alert.css"> </head> <body> <div class="container mt-5"> <h1>弹出警告框Js插件</h1> <button class="btn btn-success" id="success">Success</button> <button class="btn btn-error" id="error">error</button> <button class="btn btn-warning" id="warning">Warning</button> <button class="btn btn-info" id="info">Info</button> <button class="btn btn-danger" id="confirm">Confirm</button> <button class="btn btn-primary" id="toast">Toast</button> </div> <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/cute-alert.min.js"></script> <script> var success = document.getElementById('success'); success.addEventListener('click', ()=>{ cuteAlert({ type: 'success', title: 'Success Title', message: 'Success Message', buttonText: 'Okay' }) }) var error = document.getElementById('error'); error.addEventListener('click', ()=.........完整代码请登录后点击上方下载按钮下载查看
网友评论0