9 Replies Latest reply on Jan 8, 2013 1:12 PM by clovos83

    Buttons for web slideshow.

    clovos83

      Hey Guys,

       

      I'm trying to make a slideshow similar to what is provided through the Adobe Edge showcase sample files. Particularly the designer spotlight animation.

       

      I want to get my buttons working so that when I click one it goes to that particular slide. I have copied and modified the code to work in that way but for some reason I can't get my animations to play when I click buttons-only the first button plays the first animation. Whenever I click the other button, it behaves as if it's playing the whole animation until it reaches the point of where it needs to play from the timeline.

       

      I can post code to show you an example.

       

      Here's what I have inside of the stage code:

       

      // insert code to be run when the composition is fully loaded here

      this.circleBtnSymbol = sym.getSymbol('buttn_1');

      // turn "on" first circle btn

      this.circleBtnSymbol.stop('on');

       

       

      // global vars

      this.activePanel = 4;

      this.prevPanel = 1;

      this.panelCount = 4;

      this.panelObject;// panel

      this.circleBtnSymbol;// circle btn

      this.arrowBtnSymbol;// arrow btn

       

       

      // turn "on" first circle btn

      sym.getSymbol('buttn_1').stop('on');

       

       

       

       

       

       

      // called internally only

      this.changePanel = function()

      {

                //-- change panel

       

       

                this.stop('slide'+this.activePanel);

       

       

                this.panelObject = sym.getSymbol('slide'+this.activePanel);

                this.panelObject.play(0);

       

       

       

       

                //-- set states of circle btn

       

       

                // deactivate all btns

                var i=1;

                for( i=1; i<=this.panelCount; i++ )

                {

                          this.circleBtnSymbol = sym.getSymbol('buttn_'+i);

                          this.circleBtnSymbol.stop('off');

                }

       

       

                // set active btn

                this.circleBtnSymbol = sym.getSymbol('buttn_'+this.activePanel);

                this.circleBtnSymbol.stop('on');

       

       

                //console.log('this.activePanel = '+this.activePanel);

      }

      this.onClickCircleBtn = function( arg )

      {

                //console.log('onClickCircleBtn');

       

       

                if( arg != this.activePanel )

                {

                          this.activePanel = arg;

       

       

                          this.stop('slide'+this.activePanel);

       

       

                          this.panelObject = sym.getSymbol('slide'+this.activePanel);

                          this.panelObject.play(0);

       

       

                          this.changePanel();

                }

      }

       

      and here's an example of the code I have for button2 :

       

      mouseover- 

      // insert code for mouse enter here

       

       

      this.circleBtnSymbol = sym.getSymbol('buttn_2');

      this.circleBtnSymbol.stop('on');

       

      mouseout-

       

      // insert code for mouse leave here

       

       

      if( this.activePanel != 2 )

      {

                this.circleBtnSymbol = sym.getSymbol('buttn_2');

                this.circleBtnSymbol.stop('off');

      }

       

      click-

      this.onClickCircleBtn( 2 );

       

      ----

       

      All of the code seems to be set but I'm still not getting it to play exactly the way it should from the timeline.

       

      Can anyone help me with this?