Search the Community
Showing results for tags 'skip'.
-
Timeline Occasionally Skipping Steps - Dynamic Content Issue with WordPress
Nikos Xenakis posted a topic in GSAP
Hi everyone, I'm facing an issue occasionally, and it's a bit challenging to reproduce reliably in a CodePen due to the complexity of my setup. The issue occurs with dynamic content. Sometimes a part of a GSAP timeline is skipped. Specifically, I notice that the fromTo animations are occasionally stuck in the "to" state, while the rest of the timeline continues as expected. There’s no warning in the console from GSAP, and there are no errors about missing elements. The strange thing is that this mostly happens with WordPress menu items that come in dynamically, which leads me to suspect a timing issue with when the elements are loaded. I tried logging the elements to the console before creating the timeline, and they were all present as a NodeList. Yet, the issue persists. As I mentioned, sometimes it works perfectly fine. I managed to solve this with a slight artificial delay using setTimeout, which seems to allow the timeline to work every time. Interestingly, using GSAP's delay property didn't make a difference. However, using setTimeout feels hacky and unreliable, and I'm hoping there’s a better, more elegant solution. Setup: WordPress website JavaScript: ES6 Modules (using imports/exports) Build Tool: Webpack Has anyone faced similar issues with dynamic content in timelines, especially with WordPress or other dynamically generated content? Are there any best practices in GSAP for handling timing issues with dynamic elements, especially without resorting to setTimeout hacks? I believe this is a broader topic, as I've noticed the same problem in other projects as well. Any advice or insights are greatly appreciated. Thanks in advance!- 1 reply
-
- wordpress
- dynamic content
-
(and 2 more)
Tagged with:
-
Hi, I wanted to loop this creative 3 times but on repeat, start the animation 1.5 in, effectively leaving the picture always visible. Is there a quick way to do this? Thanks
-
Hi, I want a Timeline to skip to half way through on repeat So the first play through starts from 0, but on every play through after that, I want it to start form halfway Is that possible? var tl = new TimelineMax({repeat:-1, repeatDelay:2}); tl.to("#circle", 4, {x:400}) .seek(2)
-
I made an interactive learning site that relies entirely on GSAP (HTML 5) for its animations. Generally, all the animations are quite smooth on Chrome or Firefox, but when I try it on my iPad, they skip sometimes. It doesn't look bad on the iPad, but it skips and misses parts of some animations. I know this is a more general question, but is this poorer performance on the iPad normal, or is there anything I can do? (FYI, I am a science teacher. I am band new to coding. I just recently taught myself JS and CSS.) Thanks! BTW, the site is temporarily at: http://ketzbook.com/chem/elementsymbols/elementsymbolmatch.html
-
I wonder how to skip resp. merge tweenTo() event when triggered multiple times. Let me give an example first of all to illustrate my purpose: http://jsfiddle.net/vvweosts/1/ For now every single animation finalizes seperate each time when the button is triggered multiple times before given tweenmax is complete. But i would like to some kind of merge all triggered tweenTo() to one single animation. One tweenMax has a duration of 2sec that scale for 0.1. When i trigger the button 4 times immediately consecutively i would like the animation to end at scale(0.4) with a duration of about 2sec. Thank you in advance
- 2 replies
-
- timelinemax
- tweento
-
(and 2 more)
Tagged with: