代码之家 › 专栏 › 技术社区 › Kevin Sylvestre

jQuery将填充动画设置为零

jquery-1.4 jquery

Kevin Sylvestre · 技术社区 · 15 年前

<div id="outer"><div id="inner"></div></div> 
<script> 
  $("#inner").mouseenter(function () {
    $("#outer").animate({ 'padding' : '20px' }, "slow");
  });
  $("#inner").mouseleave(function () {
    $("#outer").animate({ 'padding' : '0px' }, "slow");
  });
</script>

4 回复 | 直到 15 年前

Nick Craver 15 年前

显然是1.4.3中的一个动画错误,现在您可以通过设置如下单个属性的动画来解决:

$("#inner").mouseleave(function () {
  $("#outer").animate({ 
    'padding-top' : 0,
    'padding-right' : 0,
    'padding-bottom' : 0,
    'padding-left' : 0,
  }, "slow");
});

You can test it out here .

jAndy 15 年前

看起来像个虫子 1.4.3 1.4.2 工作正常:

http://www.jsfiddle.net/YjC6y/44/

我会进一步调查并更新这篇文章。

jitter 15 年前

另一个解决方案是使用csshake。 Brandon Aarons jquery-cssHooks 我想起来了(在这种情况下 padding marginpadding.js )

You can test it here

Adam Boostani 13 年前

我刚刚意识到jquery对动画中的连字符“-”的反应不是很好,但是通过使用连字符并在其后大写第一个字母,可以得到相同的结果。所以你会得到这样的东西:

    $("#inner").mouseleave(function () {
       $("#outer").animate({
     paddingTop : 0,
         paddingRight : 0,
         paddingBottom : 0,
         paddingLeft : 0,
         borderLeftWidth: 0,
         borderTopWidth: 0,
         borderRightWidth: 0,
         borderBottomWidth: 0,

 }, slow);

推荐文章

code-geek · Jquery根据单选按钮选择隐藏或显示文本字段

9 月前

Dr.0000FF · jQuery按钮点击不显示/隐藏内容

10 月前

user28928120 · 如何在jquery中选择所有类?

10 月前

LauraNMS · 如何使用Waypoints js实现粘性元素和偏移量

10 月前