codeminion1

Just wanted to say thanks again. Here's my little 'proof of concept' (I still need to learn css properly). Click to 'merge' the arrays.

That response was just amazing thank you so much.

Thanks, for the example. This does what I need!!! I'm noob to javascript so one thing is confusing me. Why doesn't: this.appendChild(box); cause the box to move over and flicker for an instant and then move back and tween? I guess, does this whole function have to run before the browser re-evaluates anything and that's why it works? Or is there somewhere I can read how TweenMax actually does the tweening? I think I'm just treating this tween as a black box right now but don't understand how it's actually updating the css or how the browser actually evaluates what to put on screen.

Noob question... I want to make an animation of array elements 'merging' (like in mergesort). My plan was to have 2 containers: Array1 - initially 5 child divs (created in javascript) that are the elements Array2 - intially 5 child divs (created in javascript) that are the elements (different color) Array 3 -initially empty - (will end up being the 'merged' array) Now, I want my elements to 'fly' out of array1 and array2 and into my initially empty 3rd array. I want them to just end up wherever they would be if I just put them there directly using javascript (attach them to child element). I can't figure out the 'GSAP way' to do this. I can think of 1 solution (maybe?): 1. put an invisible element in array3 2. figure out the relative positions. 3. create the tween with a callback that goes and access the elements and changes it from being a child of e.g. array1 to array3 Is this a sensible thing to do? Or am I just not thinking about this the GSAP way? Thanks for any help.