Question

I have four divs which are animated using size, height and positions; that means, these divs change their height, width, left and top.

FOCUS:
I want to stop that animation when any of these two divs become overlapped.

HTML:

<div id="container_1">
  <div id="anim_1"></div>
  <div id="anim_2"></div>
</div>

<div id="container_2">
  <div id="anim_3"></div>
  <div id="anim_3"></div>
</div>

If any two anim divs of any container (i.e. container_1 OR container_2) bocome overlapped then I have to stop the animation of both two container divs.

Now, how can I trace out this overlapping using JQUERY or JAVASCRIPT?

Please suggest me.

Thanks in advance.

Answer 1

Take a look to the answer in this other question:

Efficiently Detect When Sibling Elements Overlap