Search the Community
Showing results for tags 'synchronize'.
Found 4 results
-
Synchronizing GSAP timelines across React components using a master timeline (with labels)
Jose Pio posted a topic in GSAP
Hi GreenSock team 👋 I'm working with Next.js 15 and trying to orchestrate animations across multiple components using a shared masterTimelinethrough context. Each component defines its own gsap.timeline() and then adds it to the global timeline via masterTimeline.add(). For example: I have two components: Boxand Nav. - Box has its tl with 4 tweens and inserts a label after the second tween (addLabel('afterSecondTween')). - Nav defines its own timeline and tries to insert it at that label inside the master timeline using masterTimeline.add(navTL, 'afterSecondTween'). 🎯 My goal is to synchronize timelines between different components, so that they run in sequence or in specific positions. 💣 The result: Nav always animates at the start of the timeline. ✅ I’ve confirmed that: - The Nav timeline is added with the same label name. - But it still plays immediately (as if the label had time = 0). 💬 My question is: Is it correct to insert timelines at labels from other components in GSAP + React? Is this synchronization possible? What is the correct or recommended way to synchronize animations between different components in GSAP and React? Is this pattern okay: 1. Each component creates its own timeline 2. One of them defines a label at a specific point 3. Another component inserts its timeline at that label Or... is there a better / more robust way to orchestrate animations across components in React using GSAP? Thanks in advance for your insights 🙏 Here’s a minimal CodePen that replicates the problem: 📎 CodePen -
I am trying to animate a cable with a plug using MorphSVG. Morphing both the cable and plug as one path gives distorted results, so I separated them. However, they do not animate together correctly. How can I sync these animations so that the plug stays on the end of the cable? I have two more of these types of animations that I need to build. Please see my codepen.
-
Can I synchronize TimelineMax/TweenMax with MainTimeline time?
biodapesada posted a topic in GSAP (Flash)
I load a swf file in my application, and the swf have some tweens (TweenMax). The problem happens when I play and stop the object, like this: var swfloader:SWFLoader = SWFLoaderObject; //SWFLoaderObject is my swf loaded var tweens:Array = tweenMaxClass.getAllTweens(); for each(var tween:* in tweens) { tween.seek(0); //0 is example } swfloader.rawContent.gotoAndPlay(0); //0 is example The objects are out of sync, and can not correctly resume animations, either by stress processor or other problem. -
synchronize Audio with animation Tweening with attachSound (as2)
duarteaugust posted a topic in GSAP (Flash)
Hi Jack! I'm trying to synchronize sequence of audios obj_snd.attachSound("audio"+idAudio) and obj_snd.start(currentTween.position), with animation MyTimelineLite.append(TweenLite.to(obj_mc, 2 {_x:200, onStart:playAudio, onStartParams:[idAudio]}) Not found any topic about the issue and I think the greenSock (which is great) does not have native support this. I need to detect whether a tween has audio attached, and moving the slideControl (drag slide) resynchronize the audio related to that tween. (I think it would be something like onMidProgress:myFunc). I think the logic is to detect the occurrence of an append (TweenLite. ..), his CurrentProgress and see if it passes onStart: PlayAudio, onStart: Params [idAudio] to synchronize ... Other two questions: 1 - audios that last beyond the animation are not accounted for by the progressBar. 2 - I'm losing onStart event to position the marker of progress midle progress of a Tween. Annex. simple .FLA I appreciate any help, Thanks! sinc_audio_tween.zip
