Javascript jQuery:鼠标交互+简单动画[img]

我是jQuery的新手，请在这里与我合作：

[网站图片]

因此，我试图让瓶子在这里与光标交互动画

目标：我希望悬停的图像出现在前景，其余的缩小到背景中

不期望的结果：代码似乎无条件地收缩所有瓶子。我似乎在if，then，else部分遇到了麻烦

过程：

储存“mouseEntered”元素，对每个瓶子执行此操作，检查是否匹配，应用效果

代码：

如果我缺少一个概念范围，或者你们有其他的方法来做这件事，那将是非常棒的

---

谢谢你们

我会这样做：

$(".sauce_bottle").mouseenter( function() {
    $(this).animate({
        height: "279px",
        width: "85px",
        opacity: "1",
    }, 150);

    $(".sauce_bottle").not(this).animate({
        height: "230px",
        width: "70px",
        opacity: ".70",
    }, 150);
});

---

您也可以粘贴HTML标记吗？使用它也是一个好主意。在动画之前停止，这样如果你不悬停动画，动画就不会继续。

$(".sauce_bottle").mouseenter( function() {
    $(this).animate({
        height: "279px",
        width: "85px",
        opacity: "1",
    }, 150);

    $(".sauce_bottle").not(this).animate({
        height: "230px",
        width: "70px",
        opacity: ".70",
    }, 150);
});