Jquery动画旋转不工作

嗨，我有这组代码，应该在某个位置旋转图标，但它不起作用。有人能帮我吗，这是我的js代码：

<script>
    window.setTimeout(function(){
    $( "#CDT492" ).animate({ "left": "+=212px" ,"top":"+=134px"}, 100000,"linear","alternate",{duration:10,queue: false,
    step: function(left) {
                if (left >= 11) { // stop at ~70
                    $("#CDT492").css('-webkit-transform','rotate(148deg)');
                }
            } }
        );
    }, 5000);
</script>

setTimeout（函数（）{
$（#CDT492”）.animate（{“左”：“+=212px”，“上”：“+=134px”}，100000，“线性”，“交替”，“持续时间：10，队列：false，
步骤：功能（左）{
如果（左>=11）{//停在~70
$（“#CDT492”）.css（'-webkit transform'，'rotate（148deg）'）；
}
} }
);
}, 5000);

---

它更像是这个动画

我不完全确定你想做什么，但看起来你想移动图像并旋转它。如果您准备使用CSS3转换，那么您可以将css值设置为您希望它们完成的内容，然后使用转换。请参阅以下内容：

虽然这是可行的，但如果可以避免的话，我认为在javascript中设置单个CSS属性并不好，因此最好定义一个类（例如，我们可以称它为

.rotated

），然后使用jquery

$（“#CDT492”）.addClass（'rotated'）

）设置该类。（像这样）

如果要在旋转已经开始移动后开始旋转，可以向过渡的旋转部分添加延迟。请看这里：

你能这样做吗

$(document).ready(function(){
   window.setTimeout(function(){
    $( "#CDT492" ).animate({ 
                        "left": "+=212px" 
                        ,"top":"+=134px"
                    },{
    step: function(now) {
                if (now >= 11) {
                    $("#CDT492").css({'transform':'rotate(148deg)','transition':'all ease 1s',});
                }
            } }
        );
    }, 5000);
});

---

你需要更明确地说明你想要什么样的变换，因为你说过你想要旋转，然后在检查链接后，更多的是变换位置。

指定是否以360度旋转（在3d中）或者在2d中。我尝试在图像到达某个位置后旋转图像。您可以计算出在所需位置旋转图像所需的延迟时间（可能使用试错法）。它需要那么精确吗？参见原始答案中的第三把小提琴，

-webkit transform 5s-linear 5s的第四部分是启动旋转动画的延迟。因此，在上述情况下，动画的持续时间为5s，开始动画的延迟时间为5s。对于移动，总持续时间为10秒。您可以使用这两个计时（只要它们的总和为10）使旋转开始于所需的位置。您实际上可能可以计算延迟的长度（如果您使用的是线性动画）非常简单，它现在确实会旋转，但我仍然需要保持动画在一条直线上，并向前移动旋转，我不知何故需要在位置上进行这种类型的转换