有没有更有效的方法来编写jQuery代码，在另一个元素悬停时更改元素的比例？

我正在寻找一种更有效的方法（如果有）来编写一些代码，允许我在“a”悬停时更改元素“B”和“C”的比例，反之亦然。我已经设法让它发挥作用了，但我希望有更好的办法。沿着这条路走下去，我希望能够将其整合到旋转木马或类似的东西中，而不会有太多的代码使网站陷入困境

以下是我到目前为止所掌握的jQuery知识：

$("#element1") // select your element
.hover(function(){ // trigger the mouseover event
    $("#element2, #element3") // select the elements to shrink
        .css({ transform: 'scale(0.9)' }); // change the scale
}, function(){ // trigger the mouseout event
    $("#element2, #element3") // select the same element
        .css({ transform: 'scale(1)' }); // original scale
});
$("#element2")
.hover(function(){
    $("#element1, #element3")
        .css({ transform: 'scale(0.9)' });
}, function(){
    $("#element1, #element3")
        .css({ transform: 'scale(1)' });
});
$("#element3")
.hover(function(){
    $("#element1, #element2")
        .css({ transform: 'scale(0.9)' });
}, function(){
    $("#element1, #element2")
        .css({ transform: 'scale(1)' });
});

提前感谢您的帮助

为每个元素分配一个类（例如，

圆圈

），而不是id，然后使用jquery中的

.not（）

函数选择除悬停元素以外的所有元素，然后相应地缩放它们

这样，您就不必为每个元素上的hover编写单独的JQuery代码，当您想要缩放除hover元素之外的所有其他元素时，可以使用下面的代码

---

代码片段：

$（“.circle”）
.hover（函数（）{
$（“.circle”）。不是（此）
.css({
变换：“比例（0.9）”
});
}，函数（）{
$（“.circle”）。不是（此）
.css({
变换：“比例（1）”
});
});
#容器{
保证金：0自动；
宽度：800px；
}
.形状1，
.shape2，
.形状3{
宽度：200px；
高度：200px；
边界半径：100px；
浮动：左；
利润率：15px；
}
.形状1{
背景色：红色；
}
.shape2{
背景颜色：绿色；
}
.形状3{
背景颜色：蓝色；
}
#要素1，
#要素2，
#元素3{
-webkit过渡：所有0.4s易用性；
-webkit转换延迟：0.1s；
-webkit转换：规模（1）；
过渡：所有0.4s缓解；
过渡延迟：0.1s；
变换：比例（1）；
}

如果它们都具有相同的直接父级，则可以使用jquery函数。我将不得不查看您的HTML以提供更准确的答案

您还可以使用如下选择器筛选
.sides（）
的结果：

 //inside hover
 $(this).siblings('[id^="element"] ');

工作得很有魅力。谢谢，斯塔克