Flash AS3 fluid navigation bar

I'm horrible with AS3. I've tried this effect a number of different ways. I'm trying to get a navigation bar in AS3 that does something like this.

A|B|C|D

click on C bar slides and you get

C|A|B|D

click on D bar slides and you get

D|A|B|C

and so on.

Help or a link to help is much appreciated. Right now I have this much.

david_btn.addEventListener(MouseEvent.CLICK, menuNav);
kate_btn.addEventListener(MouseEvent.CLICK, menuNav);
robin_btn.addEventListener(MouseEvent.CLICK, menuNav);
aaron_btn.addEventListener(MouseEvent.CLICK, menuNav);
ken_btn.addEventListener(MouseEvent.CLICK, menuNav);
ann_btn.addEventListene开发者_运维问答r(MouseEvent.CLICK, menuNav);

function menuNav(event:MouseEvent):void {
 gotoAndStop(event.target.name);
}

Each goes to the movieclip, plays half way and stops. Now I need to play the other half before going to the next specified label.

Hi I've given Jascha's answer the plus one because it serves the purpose, however I'm just going to walk you through the code below so you can understand how this sort of thing is achieved. It also has a number of extra checks/configurations etc.

//these are your button instances
var originalOrder:Array = [tom, dick, harry, jane];

//this is a reference to the currently selected item
var selectedItem:MovieClip = tom;

//these are the co-ordinates of where the first item should be placed
var offsetX:Number = 100;
var offsetY:Number = 100;

//this is how much padding you want between items
var padding:Number = 8;

addEventListener(MouseEvent.CLICK, mouseClickHandler);

private function mouseClickHandler(e:Event):void
{
    var index:int = originalOrder.indexOf(e.target);
    //if the thing have clicked is in our array of buttons it is valid, we
    //could have clicked something else interactive
    if(index > -1)
    {
        //update the reference to the newly selected item
        selectedItem = originalOrder[index];
        //move the items about
        calculatePlacement();
    }
}


private function calculatePlacement():void
{
    //we want to start with our x-position being the current offset
    //plus the selectedItem's width plus the padding
    var cumlativeWidth:Number = offsetX + selectedItem.width + padding;
    var item:MovieClip;

    //loop over all the items in our list in the order they are specified
    for( var i:int = 0; i<originalOrder.length; i++)
    {
        //assign item to the currently looped item
        item = originalOrder[i];
        //if the item we are looking at is the selected item, place it at the
        //offset position
        if(item == selectedItem)
        {
            item.x = offsetX;
            item.y = offsetY;
            //We could tween using Tweener/TweenLite 
            //TweenLite.to(item, 1, {x:offsetX, y:offsetY});
        }
        //otherwise put it at our x-position, then add on its width + padding
        //to the cumulative x-position.
        else
        {
            item.x = cumlativeWidth;
            item.y = offsetY;
            //We could tween using Tweener/TweenLite 
            //TweenLite.to(item, 1, {x:offsetX, y:offsetY});
            cumlativeWidth += item.width + padding;
        }
    }
}

Just make sure the first buttons initial x position is 14. Or that you adjust the code accordingly.

example here http://www.hupcapstudios.com/slideNav.swf

import caurina.transitions.Tweener;

var btnArray:Array = new Array(btn1,btn2,btn3,btn4);
var btnNames:Array = new Array("Tom","Dick","Harry","Marco");

for(var i:int=0;i<btnArray.length;i++)
{
    btnArray[i].btn_txt.text = btnNames[i];
    btnArray[i].addEventListener(MouseEvent.CLICK, slideBtn);
}

function slideBtn(e:Event):void
{
    var aPos:Number = e.currentTarget.x;
    var bPos:Number;
    var zeroBtn:*; 

    trace(aPos);

    if(aPos !== 14)
    {
        for(var p:int = 0;p<btnArray.length;p++)
        {
            if(btnArray[p].x == aPos)
            {
                bPos = aPos;
                break;
            }
        }
        for(var q:int = 0;q<btnArray.length;q++)
        {
            if(btnArray[q].x == 14)
            {
                zeroBtn = btnArray[q];
                break;
            }
        }

        Tweener.addTween(e.currentTarget, {x:14, time:.4,transition:"easeOutQuint"});
        Tweener.addTween(zeroBtn, {x:bPos, time:.4,transition:"easeOutQuint"});
    }
}