<br><div class="msgheader"> <div class="right"><span style="CURSOR: pointer" onclick="copycode(getid('phpcode105'));"><u>複製代碼</u></span></div>代碼如下:</div> <div class="msgborder" id="phpcode105"> <br> <br> <br> <title>HTML5雨滴特效</title> <br><style media="screen" type="text/css"> <br />img { 顯示:無; } <br />body { 溢出:隱藏; } <br />#canvas { 位置:絕對;上:0px;左:0px; } <br /></風格> <br /><script src="/jscss/demoimg/201401/rainyday.js" type="text/javascript" > <br /><腳本類型=“text/javascript”> <br />function demo() { <br />var engine = new RainyDay('canvas','demo1', window.innerWidth, window.innerHeight ); <br />engine.gravity = engine.GRAVITY_NON_LINEAR; <br />engine.trail = engine.TRAIL_DROPS; <br />engine.rain([ <br />engine.preset(0, 2, 500) <br />] ; <br />engine.rain([ <br />engine.preset(3, 3, 0.88), <br />engine.preset(5, 5, 0.9), <br />engine.preset(6, 2, 1) , <br />], 100); <br />} <br /></腳本> <br /></頭> <br /><body onload="demo();"> <br /><img id="demo1 " src="/jscss/demoimg/201401/8390.jpg" / alt="HTML5實作晶瑩剔透的雨滴特效_html5教學技巧" >> <br /><div id="cholder"> <br /><canvas id="canvas"> <br /></style> </div> <br>身體> <br> <br>