Question: I want to use the function called bounce and animate in the JqueryUI library and I'm facing 3 problems:

1) I use the following code to apply the bounce effect:

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

```

But this hides the element after the finish of bouncing. How to avoid this behavior??

2) I have centered the element using `margin-left: auto;margin-right: auto;` but during bouncing the element is positioned to the left and ignores the margin auto.

3) I use the function animate to fade in background-color to an element using this code:

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

```

For some reason this applies the animation effect till the first child div and not the whole box. For example:

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

```

This is a fiddle to explain the problem:
<http://jsfiddle.net/E5XvT/1/>

Thanks

Answer: 
from [jQuery docs](http://api.jquery.com/toggle/): 

> 
> .toggle(): Display or hide the matched elements.
> 
> 
> 

what you want is [this](http://api.jqueryui.com/effect/) : 

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

```

[Fiddle](http://jsfiddle.net/Rusln/fYggv/)

You are explicitly setting a background color on your `#child`

```
background-color: white; 

```

remove that line and it will work.
Looks like rusln answered #1...

To answer #2 use:

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

```

To answer #3 use (in css)

```
    #child {
    background-color: inherit;
    }

```

hope this helps