javascript - JqueryUI 反弹隐藏元素并将其向左移动并且动画不适用于子 div

Question

我想在 JqueryUI 库中使用名为bounce 和 animate 的函数，我面临3个问题：

1）我使用以下代码应用反弹效果：

$('#element').toggle( 'bounce', { times: 3 }, "slow" );

但这会在弹跳完成后隐藏元素。如何避免这种行为？

2）我使用元素居中，margin-left: auto;margin-right: auto;但在弹跳过程中元素位于左侧并忽略边距自动。

3）我使用函数 animate 使用以下代码淡入背景颜色到元素：

$('#element').animate({backgroundColor: '#FFFF99'}, 'slow');

出于某种原因，这会将动画效果应用到第一个子 div 而不是整个框。例如：

<div id="element">
   <p>this paragraph will get animated but the child div will not</p>
   <form>
      <div id="child"></div>   
   </form>
</div>

这是一个解释问题的小提琴：http: //jsfiddle.net/E5XvT/1/

谢谢

score 3 · Accepted Answer

.toggle()：显示或隐藏匹配的元素。

你想要的是这个：

$('#element').effect( 'bounce', { times: 3 }, "slow" );

您正在明确设置背景颜色#child

background-color: white;

删除该行，它将起作用。

score 0 · Accepted Answer

看起来 rusln 回答了 #1 ......

要回答 #2，请使用：

    <div id="element" align="center">...

回答 #3 使用（在 css 中）

    #child {
    background-color: inherit;
    }

希望这可以帮助

2 回答 2