Javascript 如何在五个不同的图像上设置相同的动画，但一次只能设置一个。当一个已设置动画时，另一个应处于其原始位置

我有六个图像形式的垂直点，我想用jquery设置它们的动画，但一次一个。。当我单击另一个图像（点）时，活动图像（点）动画应回到其原始位置，单击图像（点）应设置动画

$（文档）.ready（函数（）{
$（“.paralx-dot-1”）。单击（函数（）{
$（此）。设置动画({
高度：“60.18px”，
宽度：“60.26px”，
});
});
});
.paralx-dot-1{
高度：24.75px；
宽度：24.75px；
光标：指针；
显示：内联块；
大纲：无；
}


加速
变换
构建
点燃
开发
工程师

首先获取原始图像的高度和宽度。单击特定的
图像时
将所有其他图像的高度和宽度设置为原始高度和宽度


$（文档）.ready（函数（）{
常量高度=$（'.paralx-dot-1'）[0]。高度；
常量宽度=$（'.paralx-dot-1'）[0]。宽度；
$（“.paralx-dot-1”）。单击（函数（）{
$（'.paralx-dot-1'）.css（{“高度”：高度，“宽度”：宽度}）；
$（此）。设置动画({
高度：“60.18px”，
宽度：“60.26px”，
});
});
});
.paralx-dot-1{
高度：24.75px；
宽度：24.75px；
光标：指针；
显示：内联块；
大纲：无；
}


加速
变换
构建
点燃
开发
工程师

首先获取原始图像的高度和宽度。单击特定的
图像时
将所有其他图像的高度和宽度设置为原始高度和宽度


$（文档）.ready（函数（）{
常量高度=$（'.paralx-dot-1'）[0]。高度；
常量宽度=$（'.paralx-dot-1'）[0]。宽度；
$（“.paralx-dot-1”）。单击（函数（）{
$（'.paralx-dot-1'）.css（{“高度”：高度，“宽度”：宽度}）；
$（此）。设置动画({
高度：“60.18px”，
宽度：“60.26px”，
});
});
});
.paralx-dot-1{
高度：24.75px；
宽度：24.75px；
光标：指针；
显示：内联块；
大纲：无；
}


加速
变换
构建
点燃
开发
工程师

添加一个名为
动画的新类
：

.animate {
      height: 60.18px;
      width: 60.26px;
      transition: 0.3s;
      -o-transition: 0.3s;
      -moz-transition: 0.3s;
      -webkit-transition: 0.3s;
}

在javascript中：

$(".paralx-dots").on("click", function(){
    $(this).siblings().removeClass("animate");
    $(this).addClass("animate");
  });

添加一个名为
animate
的新类：

.animate {
      height: 60.18px;
      width: 60.26px;
      transition: 0.3s;
      -o-transition: 0.3s;
      -moz-transition: 0.3s;
      -webkit-transition: 0.3s;
}

在javascript中：

$(".paralx-dots").on("click", function(){
    $(this).siblings().removeClass("animate");
    $(this).addClass("animate");
  });