javascript - 如何将此 JavaScript 应用于所选图像？

Question

我已将此 JavaScript 应用到我的网页:

$(function() {

$('img.gallery_left').mouseover(function(){

    $('img.gallery_left').animate({
borderWidth: '10px',
width: '750px',
height: '500px',
marginLeft: '1px',
zIndex: '15'}, 'default');

});

$('img.gallery_left').mouseout(function(){

    $('img.gallery_left').animate({
borderWidth: '4px',
width: '300px',
height: '200px',
marginLeft: '1px'}, 'default');

    });
});

我将 gallery_left 类应用于许多图像，当我将鼠标悬停在其中一张图像上时，它会使具有 gallery_left 类的每个图像的大小、边框等增加。我如何才能做到仅应用悬停在其上的图像，或者我是否必须使每个图像都成为自己的类？ (我宁愿不必这样做......)

附注我对 JavaScript 不是很流利(我很惊讶我能做到这一步!)所以如果我不能立即理解您想要传达的内容，请注意。

Answer 1

在事件处理程序中，将 $('img.gallery_left') 替换为 $(this)，例如:

$('img.gallery_left').mouseover(function() {
    $(this).animate({...});
});

它们只会影响看到该事件的特定元素，而不是整个元素类。