# Expanding width/height of a shape with Tweening

Hi guys, I have some code i’m experimenting with as I learn the AS3 concepts. It is a sprite container called “menu” and I’ve created a shape called “square” in it. Now, I have it so that it uses the elastic tween functions to expand and collapse the square when MOUSE_OVER and MOUSE_OUT on the menu is triggered:

``````
var square:Shape = new Shape;
square.graphics.beginFill(0x000000);
square.graphics.drawRect(0, 0, 100, 100);
square.graphics.endFill();
// Add Listeners to Expand/Collapse Square
import fl.transitions.Tween;
import fl.transitions.TweenEvent;
import fl.transitions.easing.Elastic;
function toggleExpandSquare(e:Event):void {
var myTween_width:Tween = new Tween(square, "width", Elastic.easeOut, square.width, 200, 1, true);
var myTween_height:Tween = new Tween(square, "height", Elastic.easeOut, square.height, 320, 1, true);
myTween_width.looping = false;
myTween_height.looping = false;
}
function toggleCollapseSquare(e:Event):void {
var myTween_width:Tween = new Tween(square, "width", Elastic.easeOut, square.width, 100, 1, true);
var myTween_height:Tween = new Tween(square, "height", Elastic.easeOut, square.height, 100, 1, true);
myTween_width.looping = false;
myTween_height.looping = false;
}

``````

Problem is that I know it defaults to (0,0) and expands the height & width from the top-left corner of the shape. However, I would like it to expand from the bottom-left corner, OR from the center of the shape, etc.

I’m really baffled about how to achieve this. Thanks!