jQuery 动画在 Chrome 动画之前跳转

Question

我通过制作一个带有 overflow:hidden 的容器 div 来创建一个滑动旋转木马，并在其中制作一个图像 div，我试图通过为 left 设置动画来移动它> 位置。像这样:

HTML

<div id="placeholder">
    <div id=carousel>

         <img src="wideimagestitched.png">

    </div>
</div>

CSS:

#placeholder {
    position: relative;
    width: 500px
    overflow: hidden;
}

 #carousel {
  position: absolute;
  top: 0px;
  left: 0px;
        }

jQuery:

$("#rightbutton").click(function(event){

event.preventDefault();
$("#carousel").animate({"left": "-500px"}, 1000)

});

这在 Firefox 中运行良好且流畅，但在 chrome 中，carousel div 在动画之前向左跳了大约 200px，它应该向右跳。我已经放慢了它的速度，并且可以看到正在应用的内联样式，是的 - 它在动画之前向后跳了 200 像素左右。

感谢任何帮助!

Answer 1

你的代码工作正常看到这个DEMO