首页>>Jquery文字>>js炫酷消息通知插件(2022-02-22)

js炫酷消息通知插件

本例无需用到常见js框架和库

js炫酷消息通知插件
演示
下载
赞赏支持
立刻微信赞赏支持 关闭

 

XML/HTML Code
  1. <div class="container">  
  2.             <div class="row" style="padding:2em 0">  
  3.                 <div class="col-md-2">  
  4.                     <button class="btn btn-error"  onclick="narn('log')">默认（log）</button>  
  5.                 </div>  
  6.                 <div class="col-md-2"><button class="btn btn-success" onClick="narn('success')">成功（success）</button></div>  
  7.                 <div class="col-md-2"><button class="btn btn-warning"  onclick="narn('warn')">警告（warn）</button></div>  
  8.                 <div class="col-md-2"><button class="btn btn-danger"  onclick="narn('error')">危险（error）</button></div>  
  9.             </div>  
  10.         </div>  

 

JavaScript Code
  1. <script type="text/javascript">  
  2.         function narn (type) {  
  3.             naranja()[type]({  
  4.               title: 'New notifiaction?',  
  5.               text: 'Click on accept for create new notification',  
  6.               timeout: 'keep',  
  7.               buttons: [{  
  8.                 text: 'Aceptar',  
  9.                 click: function (e) {  
  10.                   naranja().success({  
  11.                     title: 'Notification',  
  12.                     text: 'Notification was accepted'  
  13.                   })  
  14.                 }  
  15.               },{  
  16.                 text: 'Cancelar',  
  17.                 click: function (e) {  
  18.                   e.closeNotification()  
  19.                 }  
  20.               }]  
  21.             })  
  22.           }  
  23.     </script>  

 


原文地址:http://www.freejs.net/article_jquerywenzi_933.html