particles下雪粒子动画效果代码
代码语言:html
所属分类:粒子
代码描述:particles下雪粒子动画效果代码
代码标签: particles下雪 粒子 动画
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <style> body{ margin: 0; padding: 0; } #particles-js { position: absolute; width: 100%; height: 100%; background: linear-gradient(to bottom, rgba(117, 114, 113, 0.8) 10%, rgba(40, 49, 77, 0.8) 30%, rgba(29, 35, 71, 0.8) 50%, rgba(19, 25, 28, 0.8) 80%, rgba(15, 14, 14, .8) 100%), url(//repo.bfw.wiki/bfwrepo/image/5fd8b1d9c228b.png); background-repeat: no-repeat; background-size: cover; background-position: 50% 50%; } </style> </head> <body> <div id="particles-js"></div> <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/particles.2.0.0.js"></script> <script> particlesJS("particles-js", { "particles": { "number": { "value": 400, "density": { "enable": true, "value_area": 800 } }, "color": { "value": "#ffffff" }, "shape": { "type": "image", "stroke": { "width": 3, "color": "#fff" }, "polygon": { "nb_sides": 5 }, "image": { "src": "//repo.bfw.wiki/bfwrepo/icon/5df0375c14720.png", "width": 100, "height": 100 } }, "opacity": { "value": 0.7, "random": false, "anim": { "enable": false, "speed": 1, "opacity_min": 0.1, "sync": false } }, "size": { "value": 5, "random": true, "anim&q.........完整代码请登录后点击上方下载按钮下载查看
网友评论0