如何将此 javascript 应用于所选图像？答案

【问题标题】：How do I apply this javascript to the selected image?如何将此 javascript 应用于所选图像？
【发布时间】：2013-02-06 21:53:12
【问题描述】：

我已将此 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 不是很流利，（我很惊讶我能做到这一点！！）所以如果我不能立即理解你想要表达的内容，请提醒一下。

【问题讨论】：

使用$(this).animate({ // ... })。 $('img.gallery_left').mouseout 将事件绑定到每个具有“gallery_left”类的图像。 $(this) 指的是触发事件的当前 DOM 对象，在这种情况下，图像被悬停在上面。

标签： javascript jquery class jquery-animate mouseover

【解决方案1】：

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

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

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

【讨论】：