I found an interesting JavaScript code snippet that creates a bubble particles effect around the cursor. You can download it from https://github.com/tholman/90s-cursor-effects.
However, I encountered a problem when adding certain elements inside a specific tag in my HTML document. Instead of displaying the particle effects around the cursor's actual position, all the particles get pushed to the bottom of the webpage.
Below is a sample of the JavaScript code that I'm using. As a beginner in web development, I am struggling to figure out why this issue is occurring. When the tag is empty, the particle effects follow the cursor correctly, but as soon as I add some content within the tag, the particles move to the bottom of the page and do not align with the cursor position anymore.
Here's the portion of the JavaScript code snippet:
(function bubblesCursor() {
// ... JavaScript code continues here
})();