HTML5 Canvas雨滴下落动画 超逼真

<p>

<span style="color:#444444;font-family:Helvetica, Arial, sans-serif;font-size:14px;line-height:24px;background-color:#FFFFFF;">今天我们要来分享一款相当逼真的</span><span style="font-size:14px;vertical-align:baseline;color:#444444;font-family:Helvetica, Arial, sans-serif;line-height:24px;background-color:#FFFFFF;">HTML5</span><span style="color:#444444;font-family:Helvetica, Arial, sans-serif;font-size:14px;line-height:24px;background-color:#FFFFFF;">&nbsp;Canvas雨滴下落动画，该动画模拟雨滴附在窗户上缓缓滑落的效果，同时窗户也因为雨滴而变得模糊，窗外的夜景便显得格外迷人。利用HTML5技术，该雨滴下落动画一共有5种不同的效果。由于Chrome的跨域限制，本地将无法运行，你可以在本站的在线演示中看到效果，或者将源代码上传至自己的服务器后浏览。</span> 

</p>
<p>

<span style="color:#444444;font-family:Helvetica, Arial, sans-serif;font-size:14px;line-height:24px;background-color:#FFFFFF;"><img src="/usr/uploads/image/201511/20151130171828_29678.png" alt="" /><br />

</span>
</p>
<p>

<span style="color:#444444;font-family:Helvetica, Arial, sans-serif;font-size:14px;line-height:24px;background-color:#FFFFFF;"> <!--more-->  <!--more--> <br />

</span>
</p>
<p>

<span style="color:#444444;font-family:Helvetica, Arial, sans-serif;font-size:14px;line-height:24px;background-color:#FFFFFF;"><a href="/usr/uploads/file/201511/20151130171907_43605.rar" target="_blank">下载附件</a>&nbsp; &nbsp; &nbsp; &nbsp;<a href="/usr/demo/html5-canvas-rain-drop/index.html" target="_blank">在线演示</a><br />

</span>
</p>