How to center the mouse cursor above an dragged object if the object was just before added from another object as a child to the scene? (Three.js)

I have the following problem:

I created a cube mesh consisting of five planes (The cube is unfolded and the mesh with all planes is visible. The z-coordinate of all planes is 0). All planes are children of the scene. The sixth plane (Blue plane) is laying beside the mesh and can be dragged with the mouse. If I drag this plane to the mesh and leave the mouse up the blue plane is snapping to one plane of the mesh (targetPlane.add(movingPlane) and is added as a child to this target plane. So far everything works fine.

Now I start again with the dragging. I start to drag the blue plane with the mouse. In this moment I need to add the blue plane to the scene (scene.add(movingPlane);). I have to do that because otherwise my snapping-algorithm is not working. When I add the blue plane to scene the position of the blue plane is changing. And there is an offset between my mousecursour and the plane. The mousecursor is not centered one the plane.

Trial 1:

I tried the following: Getting the global coordinates of the blue plane before adding the plane to the scene, then adding the plane to the scene, then set the position of the blue plane new with the old saved global coordinates. This is not working.

Code for trial 1: 
******************
...
var globalPos = movingPlane.getWorldPosition();
scene.add(movingPlane);
movingPlane.position.set(globalPos.x,globalPos.y,0);
...

Trial 2:

I even tried the following: Getting the 3D-mouse coordinates in the global coordinate system and setting the position of the blue plane after adding the plane to the scene to this 3D-mouse coordinates. But despite blue plane is not centered under the mouse cursor.

Code for trial 2:
*******************************
...
var vec = new THREE.Vector3(); 
mouse3D = new THREE.Vector3(); 

vec.set(( event.clientX / window.innerWidth ) * 2 - 1,- ( event.clientY / window.innerHeight ) * 2 + 1,0.5);

vec.unproject( camera );
vec.sub( camera.position ).normalize();
var distance = - camera.position.z / vec.z;
mouse3D.copy( camera.position ).add( vec.multiplyScalar( distance ) );

scene.add(movingPlane);
movingPlane.position.set(mouse3D.x, mouse3D.y);
...

Is there anybody who has an idea and could help me? Thank you very much.

Screenshot of my small application