[One of the most useful user interface constructs is the accordion panel. It allows you to stack various sections of your site and then expand and contract the sections when they’re clicked on. In this tutorial, we’ll create a basic animating accordion panel that can be used as the basis for a full Flash website.
1 [EXAMINE THE FILES]
Open the accordion folder (from the download files available at www.layersmagazine.com) and you should see two FLA files: The accordion.fla file is what you’ll need to open to start the tutorial, and the accordion_final.fla file is a finished version of the tutorial that you can use as a reference. There’s also another folder named gs, which contains an ActionScript animation library called TweenLite that we’ll use to do our animation.
click here to read more of this tutorial
It won’t work for me. What did I do wrong?
Also the files did not open in CS3
Thanks
import gs.*;
import gs.easing.*;
panel1.props ={lx:0, rx:570, ind:1};
panel2.props ={lx:60, rx:630, ind:2};
panel3.props ={lx:120, rx:690, ind:3};
panel4.props ={lx:180, rx:750, ind:4};
panel1.addEventListener(MouseEvent.CLICK, onClick);
panel2.addEventListener(MouseEvent.CLICK, onClick);
panel3.addEventListener(MouseEvent.CLICK, onClick);
panel4.addEventListener(MouseEvent.CLICK, onClick);
function onClick(e:MouseEvent):void
{
var clicked:MovieClip = MovieClip(e.target);
}for(var l:int=0; i<numChildren; i++)
{
var mc:MovieClip = MovieClip(getChildAt(i));
}if(mc.props.ind <= clicked.props.ind)
TweenLite.to(mc, 1, {x:mc.props.lx, ease:Expo.easeOut});
else
TweenLite.to(mc, 1, {x:mc.props.rx, ease:Expo.easeOut});