当用.animate（{width：'hide'}）隐藏时，元素会先消失，然后消失

Question

这个问题出现在Chrome / Chromium上（在Linux和Windows上）：当我使用JQuery隐藏带有.animate({width: 'hide'})的元素时，该元素会缩小，然后在.animate({width: 'hide'})一秒钟的时间内恢复到原始状态大小，然后立即消失。

我做了一个小提琴： http : //jsfiddle.net/FyDWE/4/

在IE9和Firefox上，一切正常。

提前致谢！

Answer 1

我无法提供解决方法（在这种情况下，您必须使用width: 'hide' ），但是当我编辑jQuery fx核心以返回时，我能够找到对我来说是一个非常奇怪的浏览器错误。闪烁点。

这是jsfiddle：

http://jsfiddle.net/FyDWE/9/

当您离开鼠标时，动画将开始缩小，并且到达终点时会突然调整为全尺寸。 现在，这是您的闪烁源代码，由于jQuery编辑而停止在此处。

如果现在编辑正在设置动画的.options span element的style属性，则可以看到其display: inline-block; overflow-x: hidden; overflow-y: hidden; width: 0px; display: inline-block; overflow-x: hidden; overflow-y: hidden; width: 0px;

现在，如果将width更改为1px ，（ display: inline-block; overflow-x: hidden; overflow-y: hidden; width: 1px; ）它将突然完全收缩。

因此，我认为闪烁是由以下原因引起的：动画达到0px，这意味着chrome中突然出现全尺寸调整，如上面的jsfiddle所示，然后隐藏了元素。 当您在IE9中尝试链接的jsfiddle时，即使宽度为0px，闪烁冻结状态也是正常的：没有像chrome中那样存在黑条。

编辑：

这是我的错误解决方法，以防万一解决方案不使用width: 'hide'是可行的：

http://jsfiddle.net/FyDWE/10/