Search the Community
Showing results for tags 'steps'.
Found 3 results
-
I am of the considered opinion that GSDevTools is one of the best things since sliced corn-bread! However ... I occasionally (and increasingly) miss the ability to manually step forwards and backwards in the timeline. I recognise that GSAP is not frame based, but in this context of stepping - I would love for it to behave as if it was. i.e. Hit the step-forward button (key) and the timeline advances +1/24 of a second. I figure there could be a default notion of 24fps, but that could be overridden with an optional named parameter during tool creation. And maybe even an option to snap to the absolute frame during step (like snap to grid).
-
I am trying animate a SVG element where the element's position/pose is held for a duration and then snaps immediately to a new position/pose, and so on and so on. I have a working example using SteppedEase, but it feels a bit hacky - as it requires me to use an undocumented 'true' parameter (mentioned in: https://greensock.com/forums/topic/13388-steppedease-to-step-immediately) and duplicate the relevant SVG element's path data from the inline SVG image - with a slight modification (otherwise the duplicated path seems to be ignored). In the codepen example - the Red square should snap to align with the Green triangle as it passes the little blue squares (at 0s, 1s and 2s). When I tried using just steps(1) - it stepped once, but at 50% of the inter-blue-square duration (1s in this example). Whereas I need it to step once at 100% of that duration. So the overall behaviour would be more akin to using a series of Hold durations.
-
Hi there, I'm having issues trying to add pauses and next/prev buttons to control the animation. I added pauses in the Timeline using addPause(), and addCallback to change the value of next label but i'm confused and it doesn't work... Here's my simplified code: var nextLabel:String=""; var tl:TimelineMax= new TimelineMax(); tl.addLabel("step1"); tl.addCallback(setNext,"step1",["step2"]) tl.append( new TweenMax(my_MC,2,{alpha:1})); tl.append( new TweenMax(my_MC,1,{x:200})); tl.addPause(); tl.addLabel("step2") tl.addCallback(setNext,"step2",["step3"]) tl.append( new TweenMax(my_MC,2,{alpha:.5})); tl.append( new TweenMax(my_MC,1,{x:400})); tl.addPause(); tl.addLabel("step3") tl.append( new TweenMax(my_MC,2,{alpha:1})); tl.append( new TweenMax(my_MC,1,{y:200})); function setNext(t):void{ nextLabel=t; } my_NextButton.addEventListener(MouseEvent.CLICK,goToStep) function goToStep(e:MouseEvent):void{ tl.play(nextLabel) } I think i'm not doing things in the correct order. Any advices ? Thanks !
