Scripted animation question

Question

Hi all,
I need a little help to solve what I think is a pretty simple problem.
This is the scenario:
A map of the world. Sixty pins in the map.
(think three pins for any examples or help)
Click any pin and an oblong box grows (animates) from it to fill the screen at about 80%. Animation lasts about a second.
OK, I could do this by making a tweened animation for each "pin" but on a weekly basis the location of the pins will change so I'm wondering if anyone
can help me design a better functionality than tweening them one by one.
i.e a function I can call to say "as any pin (let's name them pin1, pin2 etc)  is clicked, animate a "zoom box_mc" from whatever X and Y to fill the screen 80%.
Each "zoom" needs to look as if it's "growing" from it's position on the map and not just from the centre of the screen.
I'd like to use a single MC as the zoom box (or as the background to the box) so that each pin can populate the box with different dynamic content.
I'm a designer and not much of a coder and I never made the leap form AS2 to 3.
I looked through the help and found some cool stuff like THIS but after playing around for three hours I'm not getting close to what I want.
So all and any help, links, pointers or tutorials very much appreciated.
Best wishes
Tony

Answer 1

You could increase/decrease the ._width and ._height properties of the movieclip.
To do this each frame use onEnterFrame (there are other ways but here is what I know);
onEnterFrame = function(){
This goes in the main timeline, and code to execute each from goes within it.
First you need to store the new width/height of the box_mc. It's probably best to put the anchor point of the mc at the top left corner of the block.
If all 4 corners of the box need to be moved, then store the new x and y positions too in individual variables (e.g. newX, newY, newWidth, newHeight).
Secondly you need to change the current x,y, width, and height of the box_mc to be closer to those stored in the variables. You can find a way to do this, it could involve using if statements and incrementing/decrementing the x,y,width,height etc. each from until the mc_box variables are the same as those you stored in the first step.
Another way is using box_mc.propertyValue = (box_mc.propertyValue - newPropertyValue)/20; Where propertyValue could be x, y, width, height and '20' could be any number. The /20 causes the values to 'ease' together, slowing down the closer it gets to the new value. Alternatively you could divide by the real distance (using a^2+b^2=c^2) which would create a constant movement rather than an easing movement.