带Flash/Actionscript 3的3D翻转效果

Posted 2021-02-25

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

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;
	}
}