MOVED DOTTED DUST PARTICLE TEXT IN HTML BY BLOTTER JS || CSS EFFECT

HELLO, GUYS IN THIS VIDEO I AM GOING TO SHOW YOU HOW YOU CAN CREATE TEXT BY BLOTTER JS MOVED DOTTED PARTICLE. I AM GIVING YOU SOURCE CODE.

HTML CODE-:

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<meta http-equiv="X-UA-Compatible" content="ie=edge">

<title>DOTTED PARTCLE TEXT EFFECT BY BLOTTER</title>

<script src="https://cdn.rawgit.com/bradley/Blotter/master/build/blotter.min.js"></script>

<script src="https://cdn.rawgit.com/bradley/Blotter/3007fe6e/build/materials/fliesMaterial.js"></script>

<link rel="stylesheet" href="style.css">

</head>

<body>

<div id="full"></div>

<script type="text/javascript">

container = document.getElementById('full');

var text = new Blotter.Text("CREATIVE", {

family:"serif",

size:200,

fill:"#000",

paddingTop: 80,

paddingBottom:80,

paddingLeft: 80,

paddingRight: 80

});

var material = new Blotter.FliesMaterial();

material.uniforms.uPointCellWidth.value = 0.01;

material.uniforms.uPointRadius.value = 0.6;

material.uniforms.uSpeed.value = 3;

var blotter = new Blotter(material, {

texts:text

});

var scope = blotter.forText(text);

scope.appendTo(container);

</script>

</body>

</html>

css code-:

body

{

margin: 0;

padding: 0;

width: 100%;

height: 100vh;

background:url(y.jpeg);

background-position: center;

background-size: cover;

}

#full

{

text-align: center;

padding-top: 160px;

}