Javascript 轮换列表<；李>；单击任意子对象到给定位置时放置在圆上的图像的数量

我已经使用css变换在一个圆上排列了一个图像列表。我想要的是，当单击列表的任何子图像时，圆圈旋转，选定或活动的子图像到达给定位置。说3点钟。 如何使用js实现这一点。我现在不知道sass

这就是我现在得到的

!

单击任何子图像时，我希望圆旋转，以便活动图像始终位于相同的位置。说3点钟

.team list>ul>*{
/* 4 */
显示：块；
位置：绝对位置；
利润率最高：55%；
}
.团队列表>ul>：第n个类型（1）{
变换：旋转（0deg）平移（10em）旋转（0deg）；
}
.团队列表>ul>：第n个类型（2）{
变换：旋转（45度）平移（10em）旋转（-45度）；
}
.团队列表>ul>：第n个类型（3）{
变换：旋转（90度）平移（10em）旋转（-90度）；
}
.团队列表>ul>：第n个类型（4）{
变换：旋转（135度）平移（10em）旋转（-135度）；
}
.团队列表>ul>：第n个类型（5）{
变换：旋转（180度）平移（10em）旋转（-180度）；
}
.团队列表>ul>：第n个类型（6）{
变换：旋转（225deg）平移（10em）旋转（-225deg）；
}
.团队列表>ul>：第n个类型（7）{
变换：旋转（270度）平移（10em）旋转（-270度）；
}
.团队列表>ul>：第n个类型（8）{
变换：旋转（315度）平移（10em）旋转（-315度）；
}
.团队列表img{
显示：块；
宽度：100%；
}

选项1 其中一种方法是，每次用户单击一个项目时，通过在项目之间“转移”变换属性，实现一种有点吸引人但不太干净的旋转效果。您可以使用以下函数来完成此操作：

让allItems=document.getElementById（'list'）.getElementsByTagName（'li'）；
让allItemsAsArray=Array.from（allItems）；
设fixedPositions={}，transforms={}；
设auxPosition=0；
allItemsAsArray.forEach（（元素，索引）=>{
transforms[auxPosition]=window.getComputedStyle（elem.transform）；
fixedPositions[index]=auxPosition++；
元素addEventListener（'单击'，（事件）=>{
设步长=8-固定位置[索引]；
allItemsAsArray.forEach（（elem2，index2）=>{
copyTransformProp(
变换[fixedPositions[（index2+步数）%8]]
,
elem2）；
});
});
});
函数copyTransformProp（sourceProperty，targetNode）{
targetNode.style.setProperty（'transform'，sourceProperty）；
}

.team list>ul>li{
/* 4 */
显示：块；
位置：绝对位置；
最高：55%；
左：40%；
过渡：放松所有1；
}
#列表img{
宽度：50像素
}
.团队列表>ul>：第n个类型（1）{
变换：旋转（0deg）平移（10em）旋转（0deg）；
}
.团队列表>ul>：第n个类型（2）{
变换：旋转（45度）平移（10em）旋转（-45度）；
}
.团队列表>ul>：第n个类型（3）{
变换：旋转（90度）平移（10em）旋转（-90度）；
}
.团队列表>ul>：第n个类型（4）{
变换：旋转（135度）平移（10em）旋转（-135度）；
}
.团队列表>ul>：第n个类型（5）{
变换：旋转（180度）平移（10em）旋转（-180度）；
}
.团队列表>ul>：第n个类型（6）{
变换：旋转（225deg）平移（10em）旋转（-225deg）；
}
.团队列表>ul>：第n个类型（7）{
变换：旋转（270度）平移（10em）旋转（-270度）；
}
.团队列表>ul>：第n个类型（8）{
变换：旋转（315度）平移（10em）旋转（-315度）；
}
.团队列表img{
显示：块；
宽度：20%；
}

如果我不清楚，因为我是这个社区的新成员，这就是我想要做的！欢迎来到Stackoverflow社区；请务必告诉我们您迄今为止所做的一切，我们可以帮助您解决问题。：）一种方法是保持css不变，并更改列表的顺序，使选定的子对象保持在顶部，以便在3点钟定位，但我找不到一种方法来尝试。另一种方法是在单击时将每个图像旋转到所需的位置，但这是一种相当糟糕的方法。绝对位置呢？你试过这样做吗？是的，但是过渡看起来不是循环的，我不能很好地同步动画