use removeEventListener to remove the unneeded/problematic click event listeners
Unfortunately this did not work. I even tried the removeAllEventListeners and that did remove everything but then the button would not work at all after. i have tried the ".off()" and still no go.
Here is a link to a demo page with the issue.
As can be seen in the demo above, the button is bound on the first click as it transforms into an X. And still bound while it turns back to the hamburger icon. But after that - you can click anywhere on the page and it opens and closes the panel. This is not the desired effect. I would like only the button to open and close it. All the code is available in the browsers inspector. So annoying. What is most weird is that it works fine through the first run of the animation and then falls apart after that.
Thanks kglad for your help but the issue seems to be with Animate CC and it handle the .toggle() in an animated environment.
The toggleClass method was originally used to as a class checker for use as a stand alone script in a page to toggle open and closed an element.
So now i have striped the code down to just a simple click handler function with the jquery toggle of slide, and a whole bag of other problems arise.
MenuPop = $('#Menu_Pop');
Here is a link also to the code implemented:
With this code it again works fine on the first run through, but after the toggle() seems to retain a count of how may times it has been implemented. First run through works. Second run doubles the toggle call. Third tripples... and so on!
I thought that it could be controlled by stopingPropagation(), and yes this worked but then the animation has again no bounds to the button and can be set off with a click anywhere on the screen like before.
The point of this was to link the open of the animated button's phases to the open an close of the slide menu. I had the toggle linked to the canvas element right in the html and that worked but if someone were to click the canvas twice quickly, the slide menu would run the toggle twice and be out of sync with what the button was showing. This why i wanted to add the toggle button code itself.
I am open to building a better box. I was thinking i could toggleClass and use css animation to handle the open and close, but with the toggle seeming to propagate - I'm sure it will do the same for the toggleClass. That leaves me in the same place i am.
Any Ideas as to why the generated code from Animate CC is somehow remembering the number of toggles?
As always, help is appreciated.
the problem's caused by your code or/and objects changing in the different frames of your timeline(s).
ie, comment out that this.play() in Mouse_MenPop() and retest. any problems?
Fixed it. Jquery and the this.whatever cannot exist in the same click function (perhaps just this example?).
the toggle method would work by itself and the this.play would also work by itself.
the Solution was to move the call for the toggle to another frame. In other words - call the click function to run the animation on frame 1 and on frame 2 initiate the toggle function as the timeline passes frame 2 it just sets it off. Figured it had to be something stupid simple. Thank kglad for your continued help and any others who took the time to read.
Coding puzzles make beautiful pictures!
you're welcome, but there's no problem with the code you showed. ie, will work if there are no frame changes and everything is defined.