Return to Snippet

Revision: 34501
at October 23, 2010 07:12 by adamcoulombe


Initial Code
import com.greensock.TimelineLite;
import com.greensock.TweenLite;
import com.greensock.easing.*;

card.z = 300;
card.getChildAt(0).visible = false;
card.getChildAt(0).rotationY = 180;
card.addEventListener(MouseEvent.MOUSE_DOWN,cardDown);


function cardDown(e){
	flipSelf(e.currentTarget);
}

function flipSelf(self){
	var toRot;
	if(self.rotationY > 89){
		toRot = 0;
	}else{
		toRot = 180;
	}
	
	var timeline = new TimelineLite();
	timeline.insert(TweenLite.to(self,0.5,{z:200,ease:Back.easeOut }));
	timeline.insert(TweenLite.to(self,1.5,{rotationY:toRot,ease:Strong.easeInOut,onUpdate:setFlipSide, onUpdateParams:[self] }));
	timeline.insert(TweenLite.to(self,0.5,{z:300,ease:Back.easeIn }),0.75);
	
}

function setFlipSide(self){

	if(self.rotationY > 89){
		card.getChildAt(1).visible = false;
		card.getChildAt(0).visible = true;
	}else{
		card.getChildAt(0).visible = false;
		card.getChildAt(1).visible = true;
	}
}

Initial URL
http://adamcoulombe.info/lab/as3/card-flip.html

Initial Description
Demo, info & FLA download at http://adamcoulombe.info/lab/as3/card-flip.html

Initial Title
3D Flip Effect with Flash  / Actionscript 3

Initial Tags
flash

Initial Language
ActionScript 3