3 Replies Latest reply on Mar 5, 2013 6:10 PM by GusDoeMatik™

    animated buttons on Rollover

    reed5point0

      Hello loving the Edge interface for animation, but I am still a little confused after the built in tutorials. I have some pretty pictures to help explain.

       

      http://i.imgur.com/5W0Vlz4.png

       

      So here is my scene, what I want is for it to play on mouse over. I am still a little in the dark on which snippets to use to get this done properly.

        • 1. Re: animated buttons on Rollover
          GusDoeMatik™ Level 1

          It looks like you need to add some labels and stop commands.

           

          At the begining of each animation I would add a label like "Start1", "Start2", "Start3" (note each label name has to be unique).

           

          At the end of each little animation I would add a Stop trigger.

           

          Then on the button I would add a mouseover script.  You can do that by right clicking on the button and scroll down to "open actions for".

          Once you do that an actions panel will appear. click the plus button and click on mouseover. there you will be prompted to add script. Just click on the "play from" button found on the right.  That will add the code "sym.play(1000);" replace 1000 with the label name like so:

          sym.play("Start1"); (note the label nam needs to be in "" or it will fail. I would even space each animation out just a tiny bit.

          Edge Animate.jpg

          Edge Animate 2.jpg

          Edge Animate 3.jpg

          Edge Animate 4.jpg

          1 person found this helpful
          • 2. Re: animated buttons on Rollover
            reed5point0 Level 1

            Thank you Gus, this was extremely helpfull. However, I had to remove some of the the stops for it to play each animation.Three semi circles fade in above the phone like a signal bar. 1- 2 -3 so the stops caused it to only make the first one appear then the timeline would stop.

             

             

             

            HOWEVER, your guidance helped me troubleshoot and get what I need. I am more of an animator than I am a java coder, but I am really getting into this new program.

             

             

            I have one last question? How to I get it to reset back to frame 1 after the mouse leaves the button? It plays the timeline now and stops on the last frame. (see image 2) After the mouse leaves I want it to revert back to image one..

             

            day2.pngday22.png

            • 3. Re: animated buttons on Rollover
              GusDoeMatik™ Level 1

              Use the same method as explaned ubove, except instead of selecting mouseover option click the mouseout option and then tell it to go to a point in the timeline that will show nothing. So add a label to that point and direct your mouseout to that label. You should also put a Stop command there so it won't play.

               

              so your code should look like this"

               

              sym.stop("StopHere")

               

              StopHere is the label name.

               

              I hope that helps