這裡主要是應用了一個rainyday的js類別庫，使用非常簡單方便，就不多廢話了，看演示程式碼吧。 複製程式碼 程式碼如下: ttp://www.w3.org/TR/html4/loose.dtd">http://www.w3.org/TR/html4/loose.dtd"> <br /> body {<br /> overflow: hidden;<br /> height: 100%;<br /> margin: 0;<br /> padding: 0;<br /> }<br /> img {<br /> width: 100%;<br /> height: 100%;<br /> }<br /> http://maroslaw.github.io/rainyday.js/dist/rainyday.0.1.2.min.js" type="text/javascript"> <br /> function run() {<br /> var image = document.getElementById('javascript製作網頁圖片上實現下雨效果_javascript技巧');<br /> image.onload = function() {<br /> var engine = new RainyDay({<br /> image : this,<br /> });<br /> engine.rain([ [ 1, 2, 8000 ] ]);<br /> engine.rain([ [ 3, 3, 0.88 ], [ 5, 5, 0.9 ], [ 6, 2, 1 ] ], 100);<br /> }<br /> image.crossOrigin = 'anonymous';<br /> image.src = 'http://i.imgur.com/N7ETzFO.jpg';<br /> }<br /> 哇塞！ 是不是非常酷的效果呢？希望大家能夠喜歡。
