As we know, Flash doesn't have a built-in method for skewing movieclips dynamically with ActionScript. Using some rotation, stretching, more rotation, some scaling, and some trigonometry, we can skew an object with a function less than 10 lines long. The only requirement is that the object being skewed has to be nested 2 movieclips deep. Here is the function:
[as]// send it the MC that needs to be skewed, and the number of degrees to skew it _global.skewMeX = function ( skewTarget , degrees ) { // converts degrees to radians for use in trig functions skewAngle = degrees*Math.PI/360; // rotate the lowest level 45 degrees. this is necessary for the skew to be diagonal skewTarget._rotation = 45; // stretch the middle level. this line may look simple, but it was derived from a lot of math! skewTarget._parent._xscale = 100/Math.tan( -skewAngle ); // we rotate the middle level back some. not 45 degrees because when we stretched it, the angle of the base became less skewTarget._parent._rotation = skewAngle*180/Math.PI; // take the starting height and find out what that would be if it was rotated newHeight = Math.sin( -skewAngle )*skewTarget.defaultHeight; // find what the scale is from 100% newScale = 100 * newHeight / skewTarget.defaultHeight; // apply the new scale to the top level to make the object appear to stay the same size skewTarget._parent._parent._xscale = skewTarget._parent._parent._yscale = newScale; }[/as]
for the visual learners, here's a slide show visualizing each step:


In the included FLA [see the Attachments section at the bottom of this page], the bottom movieclip has the following actions: [as]onClipEvent(load) { // set the starting width and height this.defaultHeight = this._height; this.defaultWidth = this._width; } onClipEvent(enterFrame) { // find the x & y distance from this mc to the cursor yDistance = this._parent._parent._y - _root._ymouse; if ( yDistance < 10 ) { yDistance = 20; } xDistance = _root._xmouse - (this._parent._parent._x + this.defaultWidth/4); // calculate the angle to the cursor angleToCursor = Math.atan( yDistance / xDistance ) * 180/Math.PI; if (angleToCursor < 0) { angleToCursor += 180; } // call the Skew function. sends itself, and the angle to skew skewMeX(this,-1*angleToCursor); }[/as]
If you decide to dynamically create multiple instances with text in them, make sure to embed your font on the dynamic text field!

Feel free to contact me with any questions you might have. Enjoy!

-- Brian Shaler, Phoenix, AZ, USA