jQuery.animate（）强制使用“样式”；溢出：隐藏"；

jQuery的

.animate（）

在触发时强制样式

溢出：隐藏

，弄乱了我的动画元素，因为我有另一个挂起的元素，它的外部位置为负。还有什么可以避免的吗？

这是源代码：

  if ( isElement && ( p === "height" || p === "width" ) ) {
    // Make sure that nothing sneaks out
    // Record all 3 overflow attributes because IE does not
    // change the overflow attribute when overflowX and
    // overflowY are set to the same value
    opt.overflow = [ this.style.overflow, this.style.overflowX, this.style.overflowY ];
  ...
  ...
  ...
  }

if ( opt.overflow != null ) {
  this.style.overflow = "hidden";
}

如果需要，您可以将其注释掉，或者只需使用

$（'element'）.animate（）.css（'overflow'，'visible'）如前所述

溢出设置为“隐藏”的原因是，正在设置动画的元素中的元素将包含在正在设置动画的元素中。例如，如果减少元素的宽度，其内容可能会试图拉长并从底部“掉落”

上述源代码中的注释对此进行了解释：

//确保没有东西偷偷溜出去

希望这能为您解释。
另一种方法是将元素声明为！css中的重要信息

比如说

.somediv {
  overflow: visible !important;
}

你可以通过：

function（e）{$（'#something'）.css（'overflowY'，'scroll'）；}

设置为.animate（）选项参数，作为动画“完成”时运行的函数，如下所示：

$('#something').animate({
                    width: '100px',
                    height: '100px',
                    overflowY: 'scroll !important' //doesn't work
                }, { duration: 500, queue: false, complete: function(e){$('#something').css('overflowY', 'scroll');} } );

这些解决方案中的任何一个都对我有效，但我发现了窍门：

$(myDiv).animate(
   { height: newHeight},
   { duration: 500, 
     queue: false, 
     easing: 'easeOutExpo', 

     step: function() {
       $(myDiv).css("overflow","visible");
     }
   }
);

在动画的每个步骤中强制css。希望有帮助。
完美的“鹰”（2篇帖子）。如果我没有看到你的回复，我肯定会为此搜索好几个小时

“老鹰”贴出了正确的方法

所有其他的解决方案都只是黑客。这是正确的方法（重申），这就是为什么他们在使用“animate”类时为您提供所有选项的原因

下面是一些可用的设置（来自文档，）。当动画完成时，我需要“完成”设置来执行动作

    duration (default: 400)
    easing (default: swing)
    queue (default: true)
    specialEasing
    step
    progress
    complete
    start
    done
    fail
    always

这将使使用动画变得更加容易，无论是否需要，我都将在将来的所有动画中使用这种格式。
我的首选答案是使用
$.Animation.prefilter
。

设置预过滤器：

jQuery.Animation.prefilter(function(element, properties, options) {
  if (options.overrideOverflow) {
    jQuery(element).css("overflow", options.overrideOverflow);
  }
});

然后使用它

$(myDiv).animate(
  { height: newHeight},
  {
    duration: 500, 
    overrideOverflow: "visible" // Replace "visible" with your desired overflow value
  }
);

请注意，您不能使用选项名
overflow
，因为jQuery在内部使用该选项

尽管这个特性在jQuery中已经存在了一段时间，但文档似乎还不完整。但是

另请参见使用
$（'element'）.animate（）.css（'overflow'，'visible'）时的overflow-x
和
overflow-y
，则代码>可能会导致问题

在这些情况下，使用
$（'element'）.animate（）.css（'overflow'，''）
只删除溢出属性，并保持
overflow-x
和
overflow-y
完好无损。
您可以使用$（'element'）.animate（）.css（'overflow'，'visible'）；对于一些测试，您可以发布一些代码吗？这很有效，因为.animate（）在启动时只设置一次溢出！谢天谢地，我花了四个小时试图解决这个问题。是的@“我知道那种感觉，兄弟。”斯科特格林菲尔德没有穿铬17。0@ScottGreenfield-那是不对的！“重要”优先于内联样式。作者重要的样式声明优于普通样式声明，无论其特殊性如何，内联样式具有最高的特殊性，但并不优先于声明重要的样式。这有什么帮助？隐藏发生在动画期间，而不是之后。我得说这个解决方案对我有更好的帮助。它让我在动画之后保留卷轴，我只是在动画中添加了相同的东西，这样卷轴就会一直在那里。谢谢这不是答案。作为评论发布！然而，你提到的答案是我眼中最大的难题。您可以在动画的每个步骤中添加溢出：可见，这完全不需要，因为您只需设置一次。此外，jquery正在删除溢出：动画完成时隐藏自己，这样您就不必自己做。这是一种巧妙的方法。我还没有深入研究jQuery.Animation对象上可用的方法。谢谢你指出。非常优雅，谢谢！