Javascript 为什么我的翻译动画不起作用？

旋转动画正在工作。图像的大小正在改变，但图像的翻译根本不起作用。我不知道为什么，我分别试了一下，但还是不起作用。我还看了十几个其他人翻译他们的项目的例子，包括codepen上的例子。我的代码几乎是精确的，但它不会产生任何结果。为什么会发生这种情况？我如何修复它

谢谢你的建议和帮助

$（“#工具栏”）。在（“单击”，函数（）{
恒速=500；
如果（$（“#工具栏”）.css（“宽度”）=“75px”）{
$（'#toolbar'）.css（“transform”，“translateX（250px）”）；
$（'工具栏'）.css（“宽度”，“70px”）；
//更改工具栏旋转
$（“#工具栏”）。设置动画({
度数：0
}, {
持续时间：速度，
队列：false，
步骤：功能（现在）{
$（this.css）({
变换：“旋转（“+现在+”度）”
})
}
})
}否则{
$（'#toolbar'）.css（“transform”，“translateX（250px）”）；
$（'工具栏'）.css（“宽度”，“75px”）；
//更改工具栏旋转
$（“#工具栏”）。设置动画({
度数：90
}, {
持续时间：速度，
队列：false，
步骤：功能（现在）{
$（this.css）({
变换：“旋转（“+现在+”度）”
})
}
})
}
});
#工具栏{
宽度：70px；
高度：70像素；
过渡：变换500ms线性；
}
看，如果要对元素应用多个变换（旋转和平移，如此处所示），则需要这样做：

transform: rotate(90deg) translateX(30px);

但在您的情况下，您只需首先应用“变换-平移”，然后使用旋转覆盖它，如下所示：

transform: translateX(30px); //will not be working any more
transform: rotate(90deg); //override previous transform

当我按照你展示的方式做时，它不会绕着中心旋转。是否有一种简单的方法可以同时进行转换，但要按顺序进行，而不是同时进行。@Tans您可以这样做：步骤1：应用转换：translateX（250px）；步骤2：应用变换：translateX（250px）旋转（90度）；没关系，我只是试着通过做另一个变换来反转变换，但是当我可以将其设置为“”时，会进行负旋转和平移。谢谢你的帮助@Tans检查请编码笔示例-