jQuery animate 无法在 Safari 上运行

Question

我有这个为 div 设置动画的 jQuery 代码。 它在 Firefox 和 Chrome 上完美运行，但在 safari 中它不会移动，它只是在旋转，而在 Internet Explorer 中它会移动而不旋转！ 任何解决此问题的想法表示赞赏。

jQuery:

$(document).ready(function()
{   
  $(".plane").animate({
    'top':'-=0px',
    'left':'+=0px',
    rotate:-50
    }, 500, 'swing');

  $(".plane").animate({
    'top':'-=35px',
    'left':'+=590px',
    rotate:-60
    }, 7000, 'easeOutQuart');

  $(".plane").animate({
    'top':'-=0px',
    'left':'+=0px',
    rotate:25
    }, 2000, 'swing');

  $(".plane").animate({
    'top':'+=30px',
    'left':'+=10px',
    rotate:20
    }, 2000, 'easeInOutCubic');

  $(".plane").animate({
    'top':'-=0px',
    'left':'+=0px',
    rotate:10
    }, 1000, 'swing');

  $(".plane").animate({
    'top':'+=270px',
    'left':'+=180px',
    rotate:0
    }, 5000, 'easeInOutCubic');

  $(".plane").animate({
    'top':'-=0px',
    'left':'+=0px',
    rotate:-130
    }, 1000, 'swing');

  $(".plane").animate({
    'top':'-=490px',
    'left':'+=60px',
    rotate:-120
    }, 5000, 'easeInOutCubic');

  $(".plane").animate({
    'top':'-=0px',
    'left':'+=0px',
    rotate:-250
    }, 1000, 'swing');

  $(".plane").animate({
    'top':'+=150px',
    'left':'-=200px',
    rotate:-270
    }, 5000, 'easeInOutCubic');





 });

CSS：

.plane {
background-image:url('ab.png');
position:absolute;
width:48px;
height:48px;
top:400px;
left:0;
}

Answer 1

（由 OP 在对问题的编辑中回答。在此处转录为社区 wiki 答案 - 尽管它有点简洁。请参阅 Question with no answers, but issue solved in the comments (or extended in chat)）

OP 写道：

看了 200 多次后没有答案，我找到了解决方案，我会把它放在这里给那些遇到同样问题的人。您需要将元素的位置更改为“相对”。

Answer 2

就我而言，我删除了overflow-x:hidden..

 html, body {
  height: 100%;
  width: 100%;
  overflow-x: hidden;
}

到

 html, body {
   height: 100%;
   width: 100%;
 }