rainyday.js——超逼真全屏雨滴模拟插件

rainyday.js——超逼真全屏雨滴模拟插件

rainyday.js 是一个模拟雨滴落在玻璃上的JavaScript 库,基于HTML5 的canvas 。rainyday.js 做出来的雨滴效果非常逼真,在模糊背景的下的雨滴一点点爬满“玻璃”,配合着的背景音乐令人浮想联翩~~好了,有兴趣的往下看。

演示效果

夜景

rainyday-js

演示地址

夏天

rainyday-js-demo02

演示地址

森林

rainyday-js-demo03

演示地址

项目地址

github     演示页面

使用方法·示例代码
<head>
...
<script src="rainyday.js" type="text/javascript"></script>
<script type="text/javascript">
function demo() {
var engine = new RainyDay('canvas','demo1', window.innerWidth, window.innerHeight);
engine.gravity = engine.GRAVITY_NON_LINEAR;
engine.trail = engine.TRAIL_DROPS;
 
engine.rain([
engine.preset(0, 2, 500)
]);
 
engine.rain([
engine.preset(3, 3, 0.88),
engine.preset(5, 5, 0.9),
engine.preset(6, 2, 1),
], 100);
}
</script>
</head>
评分:
当前平均分 5.00 (95%) - 1 个投票
3 条 评论
  1. H5 太强大了,学习中

    10年前 回复
  2. 超逼真啊,很漂亮

    10年前 回复
  3. 也许那些HTML5的音乐网站能用上。

    10年前 回复
发表评论