Jump to content
GreenSock

Search In
  • More options...
Find results that contain...
Find results in...

jaron@numiko.com

Members
  • Posts

    5
  • Joined

  • Last visited

jaron@numiko.com's Achievements

0

Reputation

  1. So I've been looking into this a little more, and I can't appear to get it to error on CodePen, however what is interesting, is that copying that exact code into my site, with all other JS modules I'm aware of commented out / disabled, still appears to cause the issue. It's clearly something within our site that's potentially getting in the way, but given I've removed all other JS modules I'm not sure what at this point. Another strange finding, is that when not paused() by default, it works fine. But having it paused() and then initiating it on click(), is when the error seems to occur. I'm going to keep digging, but does any of that give you any more ideas? I appreciate it's a tough one given the context! Thanks.
  2. Hi both, Firstly, thanks for the reply and help, it is very much appreciated. I'll be sure to take a look at the side notes too. In the CodePen itself I have not been able to reproduce thus far, but the code is very similar to what we have in real terms. I know it's not ideal though, not being able to reproduce the bug I'm asking about. Even on my local instance, where I can reproduce the bug, it's not consistent. 90% of the time, it's fine, but then on the rare occasion the toggle function will run twice, and I'm not sure why (I only know it runs twice due to it outputting two console.log() statements) It does seem to happen across Chrome, but when testing in IE11, I seem to be able to replicate the bug more often than in any other browser, which is equally baffling, but then, it is IE. Also, we do have quite a lot of other GSAP bits and pieces going off on the site, so your guess about something else potentially getting in the way might not be a bad one. I've just removed all other JS though and the issue still persists... The weird thing is, is that when I removed all other JS modules from the site, and all other non-related JS, the issue happens consistently and I can reproduce it... I will see if I can update the CodePen to at least try and get something you can reproduce, and I'll comment back here once done 🤞 Thanks again, I really appreciate the help.
  3. I was hoping somebody might be able to help with a little GSAP issue I'm having 🤞 Essentially, on our site we have a 'Menu and Search' button, that when clicked, will animate in the various parts of the full-screen, takeover menu. As well as this, we also have a separate function which deals with toggling a few classes, etc. This function has been assigned to the onStart callback, and also the onReverseCompleted callback, however it appears that on rare occasions (and I can't seem to create a consistent test case for this) that the onStart is running twice, and therefore breaks our animation. Does anybody have any ideas as to why this may be? I've mocked up a sample CodePen with a general gist of our code, except in a more simple context. Any help would be much appreciated. Thanks!
  4. Hi Zach, Thanks, and thank you very much for the reply. That makes sense. It's always better to know why something is working so appreciate the help in understanding it. Have a good weekend and thanks again for the help.
  5. So, in the Codepen we have a fairly simple animation. On click of the button, we animate the <header> and <nav> elements in, and click it again, we animate them out. It's a toggle button. However, on mobile, we don't want to run the animation but instead want things to appear instantly. We have achieved this using calls to progress(0) or progress(1), however, we've noticed that if you first toggle the animation on desktop, and then go to mobile, and toggle it again, that without the calls to tl.reversed(false) or tl.reversed(true), the animation still tries to animate and doesn't work correctly. Does anybody have any ideas why adding those lines would make it work as I would expect it? What am I missing? To reproduce: On desktop, or anything matching the media query in the Pen (1000px), click the 'Play animation' button, then click it again to hide the animation. Reduce your screen size down to trigger the mobile code, and again, toggle the 'Play animation' button. Note: the code in the Codepen works, you'll need to remove calls to tl.reversed() on lines 18 and 21 to see the issue. Any help would be much appreciated!
×