Javascript 根据div从卡风扇向外移动它'；什么是轮换？

我正在把一手牌做成扇形。当鼠标悬停在一张牌上时，我希望它向外移动，这样看起来就像你在拔出它

像这样：

卡片的旋转在javascript中通过“90/amount of cards”90作为最大旋转角度进行。这样我就知道每张牌的角度了。 悬停最好在100%css中完成，但如果这是唯一的方法，javascript也可以

socket.on（'hand'，函数（hand）{
控制台日志（“kaarten gekregen”）；
var节点=document.getElementById（“cardwrap”）；
node.innerHTML=''；//删除手中的所有卡
var perCardRotate=90/hand.length；//计算每张卡的旋转
var perCardRotate=perCardRotate.toString（）.trim（）；
for（var i=0；i
#手动{
/*左边距：自动；
右边距：自动*/
宽度：100%；
位置：绝对位置；
浮动：左；
对齐内容：居中对齐；
利润上限：200px；
最大宽度：1180px；
左边距：60像素；
}
.卡片{
位置：相对位置；
顶部：0px；
过渡：top ease 0.5s；
左边距：-60px；
}
.卡：悬停{
顶部：-20px；
}
img{
宽度：110px；
左侧填充：4px；
右侧填充：4px；
垫面：4px；
垫底：4px；
}
为什么不使用CSS和转换


#容器{
宽度：100px；
高度：100px；
背景：透明；
位置：相对位置；
利润率：50像素；
变换：rotateX（60度）rotateZ（45度）；
变换样式：preserve-3d；z索引：98；
}
#集装箱卡{
宽度：100px；
高度：100px；
背景：ddd；
变换：rotateX（180度）rotateZ（45度）；
变换样式：保留-3d；
位置：相对位置；
z指数：99；
}
#容器：悬停。卡片{
顶部：-50px；
}

请提供您的代码，以便我们help@Teemu我添加了代码。@לבנימ㪚כה是的，显然这是我javascript代码的一个片段。我使用socket.io，但您不希望我在问题中添加整个节点服务器，因为这与此无关。基本上，对于每一张卡，也要执行
translateX（Math.sin（perCardRotate）*percardrtranslatestring）
其中
perCardRotate
是弧度。@roll@roll@roll@roll@roll@roll@roll@roll@roll@roll@roll@roll@row.com你现在是不是在试图回答我的问题？如果你抄袭我的答案，请征得我的同意：）LOLL@roll@roll@roll@roll@roll@row@road@road@rotate.com我为什么要抄袭你的答案。它不正确我自己创造了这个小提琴，这个用户复制并张贴在他/她的答案。。。但一切都很好