原生js实现小巧的右侧底部通知弹出层代码-html代码-BFW代码库

原生js实现小巧的右侧底部通知弹出层代码

代码语言：html

所属分类：弹出层

代码描述：原生js实现小巧的右侧底部通知弹出层代码

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html lang="en" >

<head>
  <meta charset="UTF-8">

  <meta name="viewport" content="width=device-width, initial-scale=1">
  
  
  
<style>
body {
	background: linear-gradient(#345, rgb(20, 25, 30));
	height: 100vh;
	margin: 0 auto;
}
.btn {
	padding: 8px;
	width: 140px;
	margin-bottom: 5px;
	border-radius: 5px;
	cursor: pointer;
	border: 2px solid rgba(0, 0, 0, 0.5);
}
.btn:hover {
	opacity: 0.8;
}
.alertBtn {
	background: lightcoral;
}
.infoBtn {
	background: lightblue;
}
.successBtn {
	background: lightgreen;
}
.errorBtn {
	background: firebrick;
}
</style>


  
</head>

<body translate="no">
  <button class="btn alertBtn" title="createToaster({type: 'alert', message: 'Ahhhhh! PANIC! Something is dreadfully wrong!', time: 4000}"><b>Alert</b> Example</button>
<br/>
<button class="btn infoBtn" title="createToaster({type: 'info', message: `Here's some information for you to use or not use as you see fit`}"><b>Info</b> Example</button>
</br>
<button class="btn successBtn" title="createToaster({type: 'success', mes.........完整代码请登录后点击上方下载按钮下载查看