I need help moving two objects at the same time

Question

I am try to create a code that will move a mini map to where the user wants in a game. As a test I created a square and converted it to a movie and named it sq. Then I created another square and converted it to a button and named it bt. I also made bt half the size of sq and placed bt at the center of sq. I then created a drag code which like this:
sq.addEventListener(MouseEvent.MOUSE_DOWN, startDragging); // Start dragging square by user
sq.addEventListener(MouseEvent.MOUSE_UP, stopDragging); // Stop dragging square by user
function stopDragging(evt:MouseEvent):void
sq.stopDrag();
bt.x=sq.x;
bt.y=sq.y;
// this moved bt to sq(x,y) when mousebutton was released
function startDragging(evt:MouseEvent):void
sq.startDrag();
bt.x=sq.x;
bt.y=sq.y;
// this moved bt to sq(x,y) when mouse button was pushed down
I am trying to get sq and bt to move smootly together, but as it stands right now it just jumps from place to place.
I have tried looking for some kind of linking code in abode help search, however, I am not sure want to look for exactlly

Answer 1

The mouseDown and mouseUp events are single action events, so the button will only change positions on either the mouseDown or the mouseUp events. If you add a mouseMove event listener, then you can change the location of the button every time the square moves. Alternately, you could use an enterframe event to change the location of the button relative to the square. Try this code:
sq.addEventListener(MouseEvent.MOUSE_DOWN, startDragging); // Start dragging square by user
sq.addEventListener(MouseEvent.MOUSE_UP, stopDragging); // Stop dragging square by user
sq.addEventListener(MouseEvent.MOUSE_MOVE,dragButton);
function stopDragging(evt:MouseEvent):void
sq.stopDrag();
function startDragging(evt:MouseEvent):void
sq.startDrag();
function dragButton(evt:MouseEvent):void {
          bt.x = sq.x;
          bt.y = sq.y;