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

时间:2022-04-23
本文章向大家介绍rainyday.js——超逼真全屏雨滴模拟插件，主要内容包括演示效果、项目地址、基本概念、基础应用、原理机制和需要注意的事项等，并结合实例形式分析了其使用技巧，希望通过本文能帮助到大家理解应用这部分内容。

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

演示效果

夜景

演示地址

夏天

演示地址

森林

演示地址

项目地址

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>

随机文章
Javascript知识点必读
最近更新