I have a canvas particles and want to put that in to a background with interactivity, no change.
Is there any way to do that?
Html:
<html>
<head>
<link rel="stylesheet" href="css.css">
</head>
<body>
<div id="particle-canvas"></div>
<script type="text/javascript" src="particle.min.js"></script>
<script type="text/javascript">
var particleCanvas = new ParticleNetwork(canvasDiv, options);
</script>
</body>
</html>
CSS:
body {
height: 100%;
width: 100%;
margin: 0;
padding: 0;
overflow: hidden;
}
#particle-canvas {
width: 100%;
height: 100%;
}
JS:
var options = {
particleColor: '#fff',
background: '#1a252f',
interactive: true,
speed: 'fast',
density: 'medium'
};
var particleCanvas = new ParticleNetwork(document.getElementById('particle-canvas'), options);