jQuery动画无法在野生动物园中使用

Question

我有这个jQuery代码，可为div设置动画。它可以在Firefox和Chrome上完美运行，但在野生动物园中它不会移动，只是在旋转，而在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%;
 }