tsparticles实现碎纸漫天飞舞粒子动画效果代码
代码语言:html
所属分类:粒子
代码描述:tsparticles实现碎纸漫天飞舞粒子动画效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8"> <style> /* ---- reset ---- */ body { margin: 0; font: normal 75% Arial, Helvetica, sans-serif; } canvas { display: block; vertical-align: bottom; } .github { bottom: 10px; right: 10px; position: fixed; border-radius: 10px; background: #fff; padding: 0 12px 6px 12px; border: 1px solid #000; } .github a:hover, .github a:link, .github a:visited, .github a:active { color: #000; text-decoration: none; } .github img { height: 30px; } .github #gh-project { font-size: 20px; padding-left: 5px; font-weight: bold; vertical-align: bottom; } </style> </head> <body > <!-- tsParticles container --> <div id="tsparticles"></div> <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/tsparticles.1.32.js"></script> <script> tsParticles.load("tsparticles", { backgroundMask: { enable: true, cover: { value: { r: 0, g: 0, b: 0 } } }, background: { image: "linear-gradient(180deg, rgba(255,0,0,1) 0%, rgba(255,154,0,1) 10%, rgba(208,222,33,1) 20%, rgba(79,220,74,1) 30%, rgba(63,218,216,1) 40%, rgba(47,201,226,1) 50%, rgba(28,127,238,1) 60%, rgba(95,21,242,1) 70%, rgba(186,12,248,1) 80%, rgba(251,7,217,1) 90%, rgba(255,0,0,1) 100%)", size: "100% 100%", repeat: "no-repeat" }, fullScreen: { enable: true, zIndex: -1.........完整代码请登录后点击上方下载按钮下载查看
网友评论0