Skip to main content
M
Multim3dia
Participant
September 10, 2018
Answered

Html5 - Button toggle movieclip only works every second reload

  • September 10, 2018
  • 1 reply
  • 334 views

Hi,

I have a simple interactive where i am showing/hiding movieclips using Toggle.

The strange thing is that they work the first time, but if i go to the next frame, then back, it doesn't work.

if i go to the next frame and back again, it works again (Every second time).

I quickly created another test animate file to see what was going out (This just had 1 Moviclip), and same result.

I called the debug log, and it seems to loop through the if else twice & prints out 4 values...

I just have two buttons (Home_btn & Toggle_btn)

// Stop at this frame
this.stop();
this.Icon1_mc.alpha = 0;
// log Movicelip alpha
console.log("Frame loaded, Movieclip alpha = " + this.Icon1_mc.alpha);
this.Home_btn.addEventListener("click", fl_GoHome.bind(this));
this.Toggle_btn.addEventListener("click", fl_ToggleIt.bind(this));
function fl_ToggleIt()
{
console.log("Movieclip alpha = " + this.Icon1_mc.alpha);
  // Hide the first and show the next here
      if (this.Icon1_mc.alpha  == 1){
  this.Icon1_mc.alpha = 0;
      }
  else {
  this.Icon1_mc.alpha = 1;
  }
}
this.Home_btn.addEventListener("click", fl_GoHome.bind(this));
function fl_GoHome()
{
this.gotoAndStop(0);
}

IF anyone has any clues it would be greatly appreciated.... it' baffling...

if anyone has 5 minutes to test, that would be greatly appreciated: test.fla - Google Drive

    This topic has been closed for replies.
    Correct answer JoãoCésar17023019

    Hi.

    It's because multiple listeners are added to the same object everytime you change frames.

    One way to prevent this is adding a custom boolean property to the main timeline and check if the frame is being visited for the first time.

    Frame 0 (1)
    if (!this.hasStarted)
        this.Start_btn.addEventListener("click", fl_GoFrame1.bind(this));
    Frame 1 (2)
    if (!this.hasStarted)
    {
        this.Home_btn.addEventListener("pressup", fl_GoHome.bind(this));
        this.Home_btn.addEventListener("click", fl_GoHome.bind(this));
        this.Toggle_btn.addEventListener("pressup", fl_ToggleIt.bind(this));
        this.hasStarted = true;
    }

    Regards,

    JC

    1 reply

    JoãoCésar17023019
    Community Expert
    JoãoCésar17023019Community ExpertCorrect answer
    Community Expert
    September 10, 2018

    Hi.

    It's because multiple listeners are added to the same object everytime you change frames.

    One way to prevent this is adding a custom boolean property to the main timeline and check if the frame is being visited for the first time.

    Frame 0 (1)
    if (!this.hasStarted)
        this.Start_btn.addEventListener("click", fl_GoFrame1.bind(this));
    Frame 1 (2)
    if (!this.hasStarted)
    {
        this.Home_btn.addEventListener("pressup", fl_GoHome.bind(this));
        this.Home_btn.addEventListener("click", fl_GoHome.bind(this));
        this.Toggle_btn.addEventListener("pressup", fl_ToggleIt.bind(this));
        this.hasStarted = true;
    }

    Regards,

    JC

      M
      Multim3diaAuthor
      Participant
      September 11, 2018

      Thanks for taking the time to assist JC, so simple, so clean...

      Works perfect.

        JoãoCésar17023019
        Community Expert
        JoãoCésar17023019Community Expert
        Community Expert
        September 11, 2018

        You're welcome!

        Terms & ConditionsAccessibility statement
        Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices