初学者JavaScript帮助-使用鼠标悬停

如何在代码中添加鼠标悬停事件以改变降雪速度。这不是我的代码，但我将其作为示例

(function() {
var requestAnimationFrame = window.requestAnimationFrame || window.mozRequestAnimationFrame || window.webkitRequestAnimationFrame || window.msRequestAnimationFrame ||
function(callback) {
    window.setTimeout(callback, 1000 / 60);
};
window.requestAnimationFrame = requestAnimationFrame;
})();


var flakes = [],
canvas = document.getElementById("canvas"),
ctx = canvas.getContext("2d"),
flakeCount = 400,
mX = -100,
mY = -100

canvas.width = window.innerWidth;
canvas.height = window.innerHeight;

function snow() {
ctx.clearRect(0, 0, canvas.width, canvas.height);

for (var i = 0; i < flakeCount; i++) {
    var flake = flakes[i],
        x = mX,
        y = mY,
        minDist = 150,
        x2 = flake.x,
        y2 = flake.y;

    var dist = Math.sqrt((x2 - x) * (x2 - x) + (y2 - y) * (y2 - y)),
        dx = x2 - x,
        dy = y2 - y;

    if (dist < minDist) {
        var force = minDist / (dist * dist),
            xcomp = (x - x2) / dist,
            ycomp = (y - y2) / dist,
            deltaV = force / 2;

        flake.velX -= deltaV * xcomp;
        flake.velY -= deltaV * ycomp;

    } else {
        flake.velX *= .98;
        if (flake.velY <= flake.speed) {
            flake.velY = flake.speed
        }
        flake.velX += Math.cos(flake.step += .05) * flake.stepSize;
    }

    ctx.fillStyle = "rgba(255,255,255," + flake.opacity + ")";
    flake.y += flake.velY;
    flake.x += flake.velX;

    if (flake.y >= canvas.height || flake.y <= 0) {
        reset(flake);
    }


    if (flake.x >= canvas.width || flake.x <= 0) {
        reset(flake);
    }

    ctx.beginPath();
    ctx.arc(flake.x, flake.y, flake.size, 0, Math.PI * 2);
    ctx.fill();
}
requestAnimationFrame(snow);
};

function reset(flake) {
flake.x = Math.floor(Math.random() * canvas.width);
flake.y = 0;
flake.size = (Math.random() * 3) + 2;
flake.speed = (Math.random() * 1) + 0.5;
flake.velY = flake.speed;
flake.velX = 0;
flake.opacity = (Math.random() * 0.5) + 0.3;
}

function init() {
for (var i = 0; i < flakeCount; i++) {
    var x = Math.floor(Math.random() * canvas.width),
        y = Math.floor(Math.random() * canvas.height),
        size = (Math.random() * 3) + 2,
        speed = (Math.random() * 1) + 0.5,
        opacity = (Math.random() * 0.5) + 0.3;

    flakes.push({
        speed: speed,
        velY: speed,
        velX: 0,
        x: x,
        y: y,
        size: size,
        stepSize: (Math.random()) / 30,
        step: 0,
        opacity: opacity
    });
}

snow();
};

canvas.addEventListener("mousemove", function(e) {
mX = e.clientX,
mY = e.clientY
});

window.addEventListener("resize",function(){
canvas.width = window.innerWidth;
canvas.height = window.innerHeight;
})

init();

（函数（）{
var requestAnimationFrame=window.requestAnimationFrame | | window.mozRequestAnimationFrame | | window.webkitRequestAnimationFrame | | window.msRequestAnimationFrame||
函数（回调）{
设置超时（回调，1000/60）；
};
window.requestAnimationFrame=requestAnimationFrame；
})();
var flakes=[]，
canvas=document.getElementById（“canvas”），
ctx=canvas.getContext（“2d”），
片数=400，
mX=-100，
mY=-100
canvas.width=window.innerWidth；
canvas.height=window.innerHeight；
函数snow（）{
clearRect（0，0，canvas.width，canvas.height）；
对于（变量i=0；i如果（flake.velY=canvas.height | | flake.y=canvas.width | | flake.x我们不能动态修改每个薄片的速度，因为这会影响性能。我们可以做的是保持最小速度，并在将此最小速度添加到原始速度后访问每个薄片的速度

请参阅下面的代码：

flakes.push({
    speed: speed,
    getSpeed: function () {
        var localSpeed = minSpeed + this.speed;
        return localSpeed;
    },
    velY: speed,
    velX: 0,
    x: x,
    y: y,
    size: size,
    stepSize: (Math.random()) / 30,
    step: 0,
    opacity: opacity
});

现在我们将使用
getSpeed（）
方法来获取雪花的速度，而不是
speed
属性

现在修改
minSpeed
值将一次性修改所有雪花的速度

这是根据鼠标指针的速度确定的速度。
你是说移动鼠标吗？不，代码中有一个mousemove事件，我想做的是添加另一个事件，允许鼠标在画布上移动时速度发生变化，我相信这是一个mouseover事件。你是说当鼠标在画布上时，你只想改变速度，还是想当鼠标移动时，我不想改变速度？我只想让雪变慢，就像鼠标在画布上时的慢动作效果一样。很抱歉回复晚了。谢谢，我相信我可以用你展示的东西来实现我想要的！