jquery动画。边界问题

Question

我遇到这种情况：http://jsfiddle.net/pedroR/wF2P5/2/

当鼠标悬停在每个列上时，其动画的宽度会发生变化。没关系。问题是最初的边界左边较大，它与列的高度相同。但我不希望这样，我希望边界保持相同的大小。我已尝试使用图像，但没有成功。

任何想法？我做错了什么，我该如何解决这个问题？

由于

Answer 1

问题是.animate()在动画运行时添加了overflow: hidden。

解决此问题而无需进行大量重做的一种方法是在致电.css('overflow','visible')时设置.animate()，例如：

$this.stop().animate({'width':'100px'},500).css('overflow', 'visible');

请参阅： http://jsfiddle.net/wF2P5/4/

Answer 2

在animate调用期间，overflow: hidden被添加到隐藏扩展边框的元素中。在动画调用之后，溢出永远不会重置。

您可以在动画完成后手动调用css('overflow', 'auto')，也可以采用不涉及相对定位的其他方式构建内容。