粒子组成文字动画效果-html代码-BFW代码库

粒子组成文字动画效果

代码语言：html

所属分类：粒子

代码描述：粒子组成文字动画效果

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">

<style>
*, *::before, *::after{
	box-sizing: border-box;
	margin: 0;
	padding: 0;
}

body, html{
	width: 100%;
	height: 100%;
	position: relative;
}


#text-container{
	font-family: 'Rock Salt';
	position: relative;
	display: block;
	width: 100%;
	height: 100%;
}
</style>

</head>
<body translate="no">
<div id="text-container"></div>

<script>
function _defineProperty(obj, key, value) {if (key in obj) {Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true });} else {obj[key] = value;}return obj;}window.onload = function () {

  const PI2 = Math.PI * 2;
  const SIN = Math.sin;
  const COS = Math.cos;
  const SMALL = 650;


  /*		/$$$$$$                                      /$$$$$$$                                      /$$$$$$$$ /$$           /$$
                     		/$$__  $$                                    | $$__  $$                                    | $$_____/| $$          | $$
                     		| $$  \__/ /$$   /$$  /$$$$$$   /$$$$$$       | $$  \ $$ /$$   /$$  /$$$$$$   /$$$$$$       | $$      | $$ /$$   /$$| $$
                     		|  $$$$$$ | $$  | $$ /$$__  $$ |____  $$      | $$  | $$| $$  | $$ /$$__  $$ |____  $$      | $$$$$   | $$| $$  | $$| $$
                     		\____  $$| $$  | $$| $$  \ $$  /$$$$$$$      | $$  | $$| $$  | $$| $$  \ $$  /$$$$$$$      | $$__/   | $$| $$  | $$|__/
                     		/$$  \ $$| $$  | $$| $$  | $$ /$$__  $$      | $$  | $$| $$  | $$| $$  | $$ /$$__  $$      | $$      | $$| $$  | $$
                     		|  $$$$$$/|  $$$$$$/| $$$$$$$/|  $$$$$$$      | $$$$$$$/|  $$$$$$/| $$$$$$$/|  $$$$$$$      | $$      | $$|  $$$$$$$ /$$
                     		\______/  \______/ | $$____/  \_______/      |_______/  \______/ | $$____/  \_______/      |__/      |__/ \____  $$|__/
                     									| $$                                          | $$                                     /$$  | $$
                     									| $$                                          | $$                                    |  $$$$$$/
                     									|__/                                          |__/                                     \______/     */


  ///////////////////////
  // UTILITY FUNCTIONS //
  ///////////////////////

  //some utility functions
  function randomInRange(min, max) {return Math.random() * (max - min) + min;}

  //I'll leave this here just in case anyone wants to play with the particles rgb channels
  //(P-P-PROTIP: setting the blue and red channels with this function makes for a cool palette)
  function randomIntInRange(min, max) {return ~~(Math.random() * (max - min) + min);}


  function mergeObjects(target, object, deep = false) {

    for (let prop in object) {
      if (target.hasOwnProperty(prop)) {
        if (typeof object[prop] === 'object' && deep) {
          target[prop] = mergeObjects(target[prop], object.........完整代码请登录后点击上方下载按钮下载查看