Posted By

adamcoulombe on 10/23/10


Tagged

flash 3D card flip effect as3


Versions (?)

Who likes this?

13 people have marked this snippet as a favorite

palo
sexyflash
tspitzr
Leang
tombarc
ckueda
liakwee
sashby
carface
banjomamo
jhoard
burnandbass
bshantz


3D Flip Effect with Flash / Actionscript 3


 / Published in: ActionScript 3
 

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

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

  1. import com.greensock.TimelineLite;
  2. import com.greensock.TweenLite;
  3. import com.greensock.easing.*;
  4.  
  5. card.z = 300;
  6. card.getChildAt(0).visible = false;
  7. card.getChildAt(0).rotationY = 180;
  8. card.addEventListener(MouseEvent.MOUSE_DOWN,cardDown);
  9.  
  10.  
  11. function cardDown(e){
  12. flipSelf(e.currentTarget);
  13. }
  14.  
  15. function flipSelf(self){
  16. var toRot;
  17. if(self.rotationY > 89){
  18. toRot = 0;
  19. }else{
  20. toRot = 180;
  21. }
  22.  
  23. var timeline = new TimelineLite();
  24. timeline.insert(TweenLite.to(self,0.5,{z:200,ease:Back.easeOut }));
  25. timeline.insert(TweenLite.to(self,1.5,{rotationY:toRot,ease:Strong.easeInOut,onUpdate:setFlipSide, onUpdateParams:[self] }));
  26. timeline.insert(TweenLite.to(self,0.5,{z:300,ease:Back.easeIn }),0.75);
  27.  
  28. }
  29.  
  30. function setFlipSide(self){
  31.  
  32. if(self.rotationY > 89){
  33. card.getChildAt(1).visible = false;
  34. card.getChildAt(0).visible = true;
  35. }else{
  36. card.getChildAt(0).visible = false;
  37. card.getChildAt(1).visible = true;
  38. }
  39. }

Report this snippet  

You need to login to post a comment.