12 Replies Latest reply on Oct 15, 2012 10:27 AM by jbowden

    Simple stop and go from a button

    Lee Tempest

      HELP!

      I have an animate document with 6 buttons (made up of an image, and svg and text) all grouped to a DIV. I then have my timeline setup so that if a button is clicked the other 5 change opacity to 50%. The animation autoplay is turned off so nothing happens when the file loads, it just displays the six buttons.

       

      I have labels on the timeline that I'm trying to reference with a click action. However whatever I do nothing works when I preview the file in a browser.

       

      There also seems to be something missing in the code panel. This is what I have assigned to a button:

       

      // insert code for mouse click here

      // play the timeline from the given position (ms or label)

      sym.play(play);

       

      Should there not be more code below the // insert code for mouse click here text?

       

      Please help I have no idea what I'm doing wrong! would be willing to send you the files to take a look.

       

      Thanks

       

      Lee

        • 1. Re: Simple stop and go from a button
          joel_pau Level 5

          Hi,

          Using a label: sym.play("myLabel");

          • 2. Re: Simple stop and go from a button
            Lee Tempest Level 1

            Joel,

            Thanks I have used what you have shown but it still does not work.

             

            I have uploaded the fielbase as a zip to:

             

            www.litchfieldmorris.co.uk/Homepage_Anim.zip

             

            The file is 1.6Mb

             

            I would welcome you expertise and look at what I have produced and why it does not work.

             

            The functionality I would like is when a user moves the mouse over (and if possible their finger on a tablet) say the Resources 'pebble' that the other five pebbles are set to 50% opacity. Then on click / press it would redirect to a url.

             

            Would you be willing to take a look at what I have so far and advise on the best solution?

             

            Thanks so much in advance.

             

            Regards

             

            Lee Tempest

            • 3. Re: Simple stop and go from a button
              joel_pau Level 5

              Well, your download link doesn't work.

              • 4. Re: Simple stop and go from a button
                Lee Tempest Level 1

                Apologies, it was in the root of server not public_html!

                 

                Please try again.

                 

                Thanks

                • 5. Re: Simple stop and go from a button
                  resdesign Adobe Community Professional & MVP

                  important things to remember:

                  • do not forget the quotation marks for the labels   sym.play(label) does not work and sym.play("label") is the right way.
                  • if you are targetting the timeline of a symbol then you need to use getSymbol.

                            for example I have a symbol called formula1 and inside it a symbol called electron1. If I want to play the electron's symbol timleine I have to use:

                       sym.getSymbol("formula1").getSymbol("electron1").play();

                  • You can also show and hide a symbol just like an element

                           var formula1 - sym.$("formula1");

                            formula1.hide();

                            formula1.show();

                  •     Just make sure you are targeting your symbol properly. example: symbol is call eight.

                                 sym.getSymbol("eight").play();

                  • 6. Re: Simple stop and go from a button
                    Eddie Ostrowski Level 2

                    resdesign, I'm trying to use symbols more. Thanks for clarifying how to use "sym.getSymbol"... it works!

                     

                    Question:  Besides the fact that symbols can be reused, is there a significant advantage to using symbols when it comes time to coding vs coding elements?

                     

                    Eddie

                    • 7. Re: Simple stop and go from a button
                      resdesign Adobe Community Professional & MVP

                      Well it all depends how your project is structured. If you need elements with different timelines, then of course you have to use symbols. To me, symbols add a lot of functionality to my projects and I use them a lot. You just have to get used to targetting them porperly. Check the API when in doubt. I still do that even though I have been working with Edge since Preview 1.

                      • 8. Re: Simple stop and go from a button
                        Eddie Ostrowski Level 2

                        Believe you hit the nail on the head when mentioning "proper targeting". It'd be great if Adobe posted a seminar online to explain, in detail for new users, the API for EA.

                         

                        Much appreciated, thanks again!

                         

                        Eddie

                        • 9. Re: Simple stop and go from a button
                          Lee Tempest Level 1

                          Thanks for the help, I did not realise I had to enclose the code within " " quotes.

                           

                          Got my functionality working now.

                           

                          One final question, I have converted all my buttons to symbols, but how do I make them a responsive size?

                           

                          I have watched the tv.adobe.com videos on flexible layouts, but they do not seem to mention how I set a symbol to be a percentage width and height. When I select the symbol on the stage the click option next to the width and height are greyed out and I cannot convert from pixel dimensions.

                           

                          Any ideas?

                           

                          Thanks

                           

                          Lee

                          • 10. Re: Simple stop and go from a button
                            jbowden Adobe Employee

                            Lee Tempest wrote:

                             

                            I have watched the tv.adobe.com videos on flexible layouts, but they do not seem to mention how I set a symbol to be a percentage width and height. When I select the symbol on the stage the click option next to the width and height are greyed out and I cannot convert from pixel dimensions.

                             

                             

                            Hi Lee,

                             

                            To make a symbol responsive, you must edit the symbol and then set both the symbol w/h to percentage, as well as those of all the child elements in the symbol.

                             

                            If you have any further questions, don't hesitate to ask.

                             

                            hth,

                            Joe

                            • 11. Re: Simple stop and go from a button
                              Lee Tempest Level 1

                              Joe,

                              Thanks for the advice on the responsive symbol. But I am not able to do what you mention.

                               

                              I have an image, piece of text and SVG graphic, all set to percentages and then make them a symbol. However I then cannot change the width and height from the px settings. See the attached screenshot.

                               

                              positionsize.png

                               

                              I cannot click on the px next to the W and H settings in either the Global or Applied options when I have the symbol selected on the stage.

                               

                              Any ideas?

                               

                              Thanks

                               

                              Lee Tempest

                              • 12. Re: Simple stop and go from a button
                                jbowden Adobe Employee

                                Hello Lee,

                                 

                                To make a symbol responsive, you must edit the symbol itself - that's what I meant when I mention editing the symbol in my first reply. You can either edit the symbol in place (double-click the symbol instance on the Stage) or edit it directly (double-click on the symbol icon in the Library panel).

                                 

                                Screen Shot 2012-10-15 at 1.24.14 PM.png

                                 

                                Once you're in symbol editing mode, click on the symbol sub-stage, and then you can change the width/height units of the symbol from px to %.

                                 

                                Hope this clarifies it,

                                Joe