将动画脚本应用于不同的Div / img

Question

在鼠标悬停时需要将animateScript（）函数应用于不同的图像/ div。我认为我只需要更改我的document.querySelector，但我不确定如何执行此操作，以便将其应用于4个不同的图像之一。

false

Answer 1

您正在对.avatar选择器进行硬编码，该选择器将始终获得该类的第一个元素，因此您正确地更改了该选择器。

一种简单的解决方案是将鼠标悬停的元素传递到您的函数中。

const handleMouseEnter = (e) => {
    const el = e.target;
    animateScript(el);
}

element.addEventListner("mouseenter", handleMouseEnter);

function animateScript(element) {
    [...]
    tID = setInterval(() => {
        element.style.backgroundPosition = `whatever style`;
        [...]
    }, interval);
}