在光标位置绘制粒子的Javascript将粒子发送到底部

，可以通过以下步骤实现：

创建一个HTML文件，并在文件中引入一个canvas元素，用于绘制粒子效果。

<!DOCTYPE html>
<html>
<head>
    <title>Particle Animation</title>
    <style>
        canvas {
            background-color: #000000;
        }
    </style>
</head>
<body>
    <canvas id="particleCanvas"></canvas>
    <script src="particle.js"></script>
</body>
</html>

创建一个JavaScript文件（例如particle.js），用于编写粒子效果的代码。

// 获取canvas元素
var canvas = document.getElementById("particleCanvas");
var ctx = canvas.getContext("2d");

// 设置canvas的宽度和高度
canvas.width = window.innerWidth;
canvas.height = window.innerHeight;

// 定义粒子对象
function Particle(x, y, radius, color, speed) {
    this.x = x;
    this.y = y;
    this.radius = radius;
    this.color = color;
    this.speed = speed;

    // 绘制粒子
    this.draw = function() {
        ctx.beginPath();
        ctx.arc(this.x, this.y, this.radius, 0, Math.PI * 2, false);
        ctx.fillStyle = this.color;
        ctx.fill();
        ctx.closePath();
    }

    // 更新粒子位置
    this.update = function() {
        this.y += this.speed;
        this.draw();
    }
}

// 创建粒子数组
var particles = [];

// 在光标位置创建粒子
function createParticle(event) {
    var x = event.clientX;
    var y = event.clientY;
    var radius = Math.random() * 5 + 1;
    var color = "rgb(" + Math.random() * 255 + "," + Math.random() * 255 + "," + Math.random() * 255 + ")";
    var speed = Math.random() * 3 + 1;

    particles.push(new Particle(x, y, radius, color, speed));
}

// 监听鼠标移动事件，创建粒子
canvas.addEventListener("mousemove", createParticle);

// 动画循环
function animate() {
    requestAnimationFrame(animate);
    ctx.clearRect(0, 0, canvas.width, canvas.height);

    for (var i = 0; i < particles.length; i++) {
        particles[i].update();

        // 移除超出画布的粒子
        if (particles[i].y > canvas.height) {
            particles.splice(i, 1);
            i--;
        }
    }
}

// 启动动画
animate();