3 Replies Latest reply on Oct 21, 2013 2:52 AM by AMULI

    slideshow buttons dont work properly

    pointseven

      okay i know this is very simple, however i have spent nearly 3 hours trying to find the answer and i can't find it. I am working in edge animate.

      I have a slideshow of 20 hard coded images and I just want two buttons to navigate between them to make it simpler. I have one picture every 250ms and each is labeled with "f1", "f2", etc. I am using a sym.stop(); trigger on the timeline at each label and the forward button has a simple sym.play(); and the reverse button a simple sym.playReverse();. This sort of works however it doesn't stop at the first and last frame properly. It also skips a picture each time i change direction (ex: changing from playing forwards to playing backwards) I tried a lot of alternative codes like playing the playhead for only 250ms which I couldn't get working either

      i guess an array of labels in a list could work, and moving up and down the chain with the back/fwd buttons would work but i dont know how do that either. I would actually prefer this.

      Any help would be greatly appreciated.

      some screenshots because its in Edge Animate and this is hopefully more comprehensible.

      http://i44.tinypic.com/2qlv4o4.jpg

      http://i43.tinypic.com/anih02.jpg

      http://i43.tinypic.com/c21qw.jpg

      http://i44.tinypic.com/15ot352.jpg

        • 1. Re: slideshow buttons dont work properly
          elainecc Adobe Employee

          Hi there, pointseven-

           

          Can you post your entire project for us to take a look at?  I can't tell right now why the first and last ones are skipping from your screenshots.

           

          Thanks,

           

          -Elaine

          • 2. Re: slideshow buttons dont work properly
            AMULI Level 4

            Hi pointseven,

             

             

            As your images are every 250 ms, you don't need any labels.

             

            sym.stop() triggers at each label are useless as well : instead of using sym.play() and sym.playReverse() (there is nothing to play ), just use sym.stop(<ms>). You get the current position in the timeline via sym.getPosition().

             

            Suppose four images at 0, 250, 500 and 750 ms and two buttons named prev and next.

             

            Stage > compositionReady event handler :

             

            sym.stop();

            sym.$('prev').hide();

             

            next > click event handler :

             

            sym.stop( sym.getPosition() +250);

            sym.$('prev').show(); // just after moving one slide forward, it makes sense moving backward

            if (sym.getPosition() == 750) // last image

            {

              sym.$('next').hide();

            }

             

            prev > click event handler :

             

            sym.stop( sym.getPosition() -250);

            sym.$('next').show();

            if (sym.getPosition() == 0)

            {

              sym.$('prev').hide();

            }

             

            Instead of hiding/showing the buttons, you could set their opacity. A hidden button is not clickable, but a button with reduced opacity is, hence a test at the begining of the click event handlers.

             

            Stage > compositionReady event handler :

             

            sym.stop();

            sym.$('prev').css('opacity','0.5');

             

            next > click event handler :

             

            if (sym.getPosition() == 750)

            {

              return; // click not processed

            }

            sym.stop( sym.getPosition() +250);

            sym.$('prev').css('opacity','1');

            if (sym.getPosition() == 750)

            {

              sym.$('next').css('opacity','0.5');

            }

             

            prev > click event handler :

             

            if (sym.getPosition() == 0)

            {

              return;

            }

            sym.stop( sym.getPosition() -250);

            sym.$('next').css('opacity','1');

            if (sym.getPosition() == 0)

            {

              sym.$('prev').css('opacity','0.5');

            }

             

            The two examples are downloadable here : https://app.box.com/s/cptzincsd1ed3ssi3gr1

             

            Gil

            1 person found this helpful
            • 3. Re: slideshow buttons dont work properly
              AMULI Level 4

              PS : I started setting the autoplay property of the Stage symbol to false, but then sym.getPosition() returns -1.

               

              So I turned to a sym.stop(); trigger at 0 ms, which has the same effect as autoplay = false, except now sym.getPosition() returns 0 as expected.

               

              Gil

              1 person found this helpful