1 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
2 <html>
3 <head>
4 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
5 <style media="screen">
6 body {
7 overflow: hidden;
8 height: 100%;
9 margin: 0;
10 padding: 0;
11 }
12
13 img {
14 width: 100%;
15 height: 100%;
16 }
17 </style>
18 <script src="http://maroslaw.github.io/rainyday.js/dist/rainyday.0.1.2.min.js" type="text/javascript"></script>
19 <script type="text/javascript">
20 function run() {
21 var image = document.getElementById('background');
22 image.onload = function() {
23 var engine = new RainyDay({
24 image : this,
25 });
26 engine.rain([ [ 1, 2, 8000 ] ]);
27 engine.rain([ [ 3, 3, 0.88 ], [ 5, 5, 0.9 ], [ 6, 2, 1 ] ], 100);
28 }
29 image.crossOrigin = 'anonymous';
30 image.src = 'http://i.imgur.com/N7ETzFO.jpg';
31 }
32 </script>
33 <title>哇塞!</title>
34 </head>
35 <body onLoad="run();">
36 <img id="background" alt="background" src="" />
37 </body>
38 </html>