I'm facing an issue with a button on my HTML page that features a background created using the popular particle library. The button is visible but not clickable. I've attempted adjusting the background size and alignment without success. How can I resolve this and make the button clickable?
Here's my code:
HTML:
<div id="particles-js" ><canvas class="particles-js-canvas" width="500" height="1000"></canvas></div>
<button type="button" class="btn btn-info" onclick="alert('hello')">Info</button>
CSS:
body {
background: #212121;
}
.particles-js-canvas{
width: 100%;
height: 100%;
position: fixed;
left: 0px;
right: 0px;
}
And the Javascript code to initialize the particles:
$(window).on('load', function() {
particlesJS("particles-js", {
"particles": {
// Particle settings
},
"interactivity": {
// Interactivity settings
},
"retina_detect": true
});
});