在右侧弹出层，弹出内容，一段时间后自动消失，可以打开多个

在右侧弹出层，弹出内容，一段时间后自动消失，可以打开多个

 

演示

 

 

XML/HTML Code

1. <div class='content'>  
2.         
3.        
4.       <section class='example'>  
5.         <p>  
6.           <ul>  
7.             <li>  
8.               <a class='error' href='#'>Error!</a>  
9.             </li>  
10.             <li>  
11.               <a class='notice' href='#'>Notice!</a>  
12.             </li>  
13.             <li>  
14.               <a class='warning' href='#'>Warning!</a>  
15.             </li>  
16.           </ul>  
17.         </p>  
18.       </section>  
19.         
20.     </div>  

 sample.js

 

JavaScript Code

1. // Generated by CoffeeScript 1.6.3  
2. (function() {  
3.   $(function() {  
4.     $.growl({  
5.       title: "Growl",  
6.       message: "The kitten is awake!"  
7.     });  
8.     $('.error').click(function(event) {  
9.       event.preventDefault();  
10.       event.stopPropagation();  
11.       return $.growl.error({  
12.         message: "The kitten is attacking!"  
13.       });  
14.     });  
15.     $('.notice').click(function(event) {  
16.       event.preventDefault();  
17.       event.stopPropagation();  
18.       return $.growl.notice({  
19.         message: "The kitten is cute!"  
20.       });  
21.     });  
22.     return $('.warning').click(function(event) {  
23.       event.preventDefault();  
24.       event.stopPropagation();  
25.       return $.growl.warning({  
26.         message: "The kitten is ugly!"  
27.       });  
28.     });  
29.   });  
30.   
31. }).call(this);  

 

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