javascript div overlap

Question

In my page am using effect.shrink().

While clicking fast the div tags are overlapping with other tags.

How do I solve this problem? Am using scriptaculous.js and prototype.js

Answer 1

What do you have the duration of the effect set to? The default is 1.0 seconds. Try reducing this so the effect doesn't take so long and is able to complete before your next click.

<a href="#" onclick="Effect.Shrink('myDiv', { duration : 0.1 } );">Shrink</a>
<div id="myDiv">
   ....
</div>

Answer 2

Set the padding of that div to 0, and use the inner elements to do the padding instead.