如何在JQuery中解决此旋转图像问题？

我有一只独角鲸，它游来游去，朝着它要去的方向翻转。单击后，它会旋转360度，然后继续游泳。但在旋转之后，它就不再朝着它要去的方向翻转了。我怎样才能解决这个问题

var$narhall=$（“#narhalid”）；
移动独角鲸（$独角鲸）；
功能移动独角鲸（$narhal）{
var myX=Math.floor（Math.random（）*（$（window.width（）-$narhall.width（））
var myY=Math.floor（Math.random（）*（$（window.height（）-$narhall.height（））
如果（$narhall.offset（）.left

。翻转{
-moz变换：scaleX（-1）；
-o变换：scaleX（-1）；
-webkit转换：scaleX（-1）；
转换：scaleX（-1）；
过滤器：FlipH；
-ms过滤器：“FlipH”；
}
#独角鲸{
位置：绝对位置；
}

---

您需要检查并删除元素内联存在的转换。为了确保翻转状态仍然保持不变，还建议检查并将另一个翻转的

transform

作为if添加到旋转功能中

var$narhall=$（“#narhalid”）；
移动独角鲸（$独角鲸）；
功能移动独角鲸（$narhal）{
var myX=Math.floor（Math.random（）*（$（window.width（）-$narhall.width（））
var myY=Math.floor（Math.random（）*（$（window.height（）-$narhall.height（））
如果（$narhall.offset（）.left

。翻转{
-moz变换：scaleX（-1）；
-o变换：scaleX（-1）；
-webkit转换：scaleX（-1）；
转换：scaleX（-1）；
过滤器：FlipH；
-ms过滤器：“FlipH”；
}
#独角鲸{位置：绝对；}

---

您需要检查并删除元素内联存在的转换。为了确保翻转状态仍然保持不变，还建议检查并将另一个翻转的

transform

作为if添加到旋转功能中

var$narhall=$（“#narhalid”）；
移动独角鲸（$独角鲸）；
功能移动独角鲸（$narhal）{
var myX=Math.floor（Math.random（）*（$（window.width（）-$narhall.width（））
var myY=Math.floor（Math.random（）*（$（window.height（）-$narhall.height（））
如果（$narhall.offset（）.left

。翻转{
-moz变换：scaleX（-1）；
-o变换：scaleX（-1）；
-webkit转换：scaleX（-1）；
转换：scaleX（-1）；
过滤器：FlipH；
-ms过滤器：“FlipH”；
}
#独角鲸{位置：绝对；}

这对我很有用。（我已经更新了演示片段以包含一个图像，这样我们就可以看到它工作了）它可以工作，但在旋转一次后，它再也不会翻转图像了，我不知道为什么。它仍然应该沿图像移动的方向翻转图像，但一旦图像旋转，它就不会这样做。我怀疑同时支持缩放和过滤的浏览器会将图像翻转两次，所以看起来它根本没有翻转，但这只是一个想法。我不知道这是否是一个浏览器的东西。对我（Chrome、osx）来说，它似乎完全可以工作，而且每次方向改变时它都会翻转。它对我来说很有效。（我已经更新了演示片段以包含一个图像，这样我们就可以看到它工作了）它可以工作，但在旋转一次后，它再也不会翻转图像了，我不知道为什么。它仍然应该沿图像移动的方向翻转图像，但一旦图像旋转，它就不会这样做。我怀疑同时支持缩放和过滤的浏览器会将图像翻转两次，所以看起来它根本没有翻转，但这只是一个想法。我不知道这是否是一个浏览器的东西。对我（Chrome、osx）来说，它似乎完全工作，每次方向改变时都会翻转。