Jump to content
Search Community

rmcnaugh

Members
  • Posts

    2
  • Joined

  • Last visited

rmcnaugh's Achievements

0

Reputation

  1. Thanks. I am actually at active den now viewing examples, but I would like to figure out how to do this. rmcnaugh...
  2. Hi and thanks for viewing this post. I am a begging as3 coder and I just need help with a project I'm working on. I need a carousel effect that is like this: http://www.chipotle.com/en-us/chipotle_story/where_did_we_come_from/where_did_we_come_from.aspx . I have six images in an array.The image that is pressed scales up and the others should switch to fill that position in carousel motion. I have tried to Use tweenLite {bezier} to get a carousel effect like thte one in the link, but to no avail. I know I need to put the rotation effect also in a array, but I don't know how to do this. Here is the main code: //tweens import com.greensock.*; import com.greensock.easing.*; import com.greensock.plugins.*; import com.greensock.plugins.TweenPlugin; TweenLite.to(brainFade, 1.5, {scaleX:1, scaleY:1, ease:Expo.easeOut}); ///BUTTONS ARRAY var nvArryLocat:Array=[mainInsight.dog,mainInsight.mikes,mainInsight.snakeOil,mainInsight.indian,mainInsight.women,mainInsight.pig]; for (var i:int = 0; i < nvArryLocat.length; i++) { nvArryLocat[i].buttonMode = true; nvArryLocat[i].addEventListener(MouseEvent.ROLL_OVER,nvArryOver); nvArryLocat[i].addEventListener(MouseEvent.ROLL_OUT,nvArryOut); nvArryLocat[i].addEventListener(MouseEvent.CLICK, clickHandler); } function nvArryOver(event:MouseEvent):void { TweenLite.to(event.currentTarget, .5,{alpha:.5, ease:Expo.easeOut,overwrite:false}); } function nvArryOut(event:MouseEvent):void { TweenLite.to(event.currentTarget, .5,{alpha:1, ease:Expo.easeOut,overwrite:false}); } ///ON CLICK FUNCTION function clickHandler(event:MouseEvent):void { TweenLite.to(event.currentTarget, .5,{x:event.currentTarget.width/mainInsight.width,y:event.currentTarget.height/mainInsight.height, alpha:1,scaleX:1, scaleY:1, ease:Elastic.easeOut, delay:.5}); TweenLite.to(brain, 1, {alpha:0});//brain fade out trace("you clicked " + event.target.name); for (var i:int = 0; i < nvArryLocat.length; i++) { if (event.currentTarget == nvArryLocat[i]) {; nvArryLocat[i].alpha = 1; nvArryLocat[i].mouseEnabled=false; nvArryLocat[i].removeEventListener(MouseEvent.ROLL_OVER,nvArryOver); nvArryLocat[i].removeEventListener(MouseEvent.ROLL_OUT,nvArryOut); nvArryLocat[i].removeEventListener(MouseEvent.CLICK,clickHandler); // switch (event.currentTarget) { case mainInsight.dog: mainInsight.gotoAndStop(2); header.gotoAndPlay("headerTwo"); insightText.gotoAndPlay("The Competition"); break; case mainInsight.mikes: mainInsight.gotoAndStop(9); header.gotoAndPlay("headerThree"); insightText.gotoAndPlay("Real Estate Media"); break; case mainInsight.snakeOil: mainInsight.gotoAndStop(16); header.gotoAndPlay("headerFour"); insightText.gotoAndPlay("The Sales Stigma"); break; case mainInsight.indian: mainInsight.gotoAndStop(22); header.gotoAndPlay("headerFive"); insightText.gotoAndPlay("Headhunting"); break; case mainInsight.women: mainInsight.gotoAndStop(28); header.gotoAndPlay("headerSix"); insightText.gotoAndPlay("Smear Tactics"); break; case mainInsight.pig: mainInsight.gotoAndStop(34); header.gotoAndPlay("headerSeven"); insightText.gotoAndPlay("Franchising"); break; } } else { nvArryLocat[i].buttonMode=true; nvArryLocat[i].mouseEnabled=true; nvArryLocat[i].addEventListener(MouseEvent.ROLL_OVER,nvArryOver); nvArryLocat[i].addEventListener(MouseEvent.ROLL_OUT,nvArryOut); nvArryLocat[i].addEventListener(MouseEvent.CLICK, clickHandler); } } } and here is the basic code on the 2nd frame of the "mainInsight" movieclip that houses the array of images: //tweens import com.greensock.*; import com.greensock.easing.*; import com.greensock.plugins.*; import com.greensock.plugins.TweenPlugin; import com.greensock.plugins.BezierPlugin; TweenLite.to(mikes, 1, {y:homeTwo.y, x:homeTwo.x, scaleX:.25, scaleY:.25, ease:Bounce.easeOut}); TweenLite.to(snakeOil, 1, {y:homeThree.y,x:homeThree.x,scaleX:.26, scaleY:.26, ease:Elastic.easeOut}); TweenLite.to(indian, 1, {y:homeFour.y,x:homeFour.x,scaleX:.31, scaleY:.31, ease:Elastic.easeOut}); TweenLite.to(women, 1, {y:homeFive.y,x:homeFive.x, scaleX:.37,scaleY:.37, ease:Elastic.easeOut}); TweenLite.to(pig, 1, {y:homeSix.y, x:homeSix.x, scaleX:.35, scaleY:.35, ease:Elastic.easeOut,onComplete:CurveOne}); function CurveOne(){ homeOne.x=-101.55; homeOne.y=157.65; // homeTwo.x=-57.6; homeTwo.y=197.7; // homeThree.x=-3.55; homeThree.y=223.35; // homeFour.x=64.85; homeFour.y=223.35; // homeFive.x=130.25; homeFive.y=208.35; // homeSix.x=181.55; homeSix.y=172.35; // TweenLite.to(mikes, 1, {bezier:[{x:-90, y:120}, {x:homeOne.x, y:homeOne.y}], scaleX:.25, scaleY:.25, ease:Expo.easeOut, delay:.1}); TweenLite.to(snakeOil, 1, {bezier:[{x:-90, y:120}, {x:homeTwo.x, y:homeTwo.y}], scaleX:.26, scaleY:.26, ease:Expo.easeOut, delay:.2}); TweenLite.to(indian, 1, {bezier:[{x:-90, y:120}, {x:homeThree.x, y:homeThree.y}], scaleX:.31, scaleY:.31, ease:Expo.easeOut, delay:.3}); TweenLite.to(women, 1, {bezier:[{x:-90, y:120}, {x:homeFour.x, y:homeFour.y}], scaleX:.37, scaleY:.37, ease:Expo.easeOut, delay:.4}); TweenLite.to(pig, 1, {bezier:[{x:-90, y:120}, {x:homeFive.x, y:homeFive.y}], scaleX:.35, scaleY:.35, ease:Expo.easeOut, delay:.5}); } The other actions inside the "mainInsight" movieclip follow suit. I know there is a simpler way to achieve the effect from the Chipolte website, but I haven't been able to figure out how to do this. Here is a link to download the Fla and swf: http://darthrayzor.com/testSites/tweenTestFinalFour.fla http://darthrayzor.com/testSites/tweenTestFinalFour.swf Any help would be appreciated rmcnaugh...
×
×
  • Create New...