Search the Community
Showing results for tags 'resume'.
Found 11 results
-
//this right here is a code inside a function which gets called multiple times and responsible to animate multiple objects from its initial position to targeted position(object and position changes after every iteration). //Also a progress bar is implemented which is responsible to show the progress of the animation. this.tween = new TimelineMax({ onUpdate: showProgress.bind(this)}); this.tween.to(from, { duration: 10, x: to.x, y: to.y, z: to.z ,}); this.tween.from(".red", this.tween.duration(), { scaleX: 0, transformOrigin: "0px 0px", ease: Linear.easeNone }, 0); function showProgress() { this.progress= new TweenLite.set(progress, { scaleX: this.tween.progress(), transformOrigin: "0px 0px" }); duration.innerHTML = "Progress:" + parseInt(this.tween.time() * 10) + "%"; } } //i want to create a function which gets all the animating objects(15) in the scene and apply pause to all of them //right now what happens is pause is being applied to only one object not all the objects. //please help pauseAnimation: function() { this.tween.pause() }
-
What best way to make complexe text callBack (story) inside a time line ? currently this not work fine ! plz see : function txt0() { line:6 https://codepen.io/djmisterjon/pen/BaarKLL if you look console, it should show 0,1,2 ! but it seem buggy here. Are you able to show some versions on how to use that kind of stuff correctly ? I need a clean way because it a very complex system events managers.
-
Hello everyone at GSAP forum. I appreciate any help with my problem I've been solving some time. There are few things I can't understand. This is my problem: Because I need to use some Tweens or Timelines repeatedly I decided to create functions with these Tweens/Timelines. These functions are appended to Timeline by .call() or .add() (both doesn't works) like this: var myTimeline = new TimelineMax() .add(down) .call(up) .add(TweenMax.to("box3", 1, {autoAlpha:0.2, scale:0.8, ease: Back.easeOut} )) ---------- function down() { var downTween = new TimelineMax() .add(TweenMax.to("#box1", 2, {scale:1, rotation:"-=30", ease: Back.easeOut} )) .add(TweenMax.to("#box2", 2, {y:"+=40", autoAlpha:1, scale:1, ease: Linear.easeOut} )) } ----------- No function in myTimeline waits for previous to complete - everything plays together - I'm not used to this behavior. I don't wanna use labels or something like that - I need them to chain (first one ends - second starts) as usualy when I add only tweens into timeline. Well, I tried to resolve my problem by some tricks but meet even more problems 1) I tried to use .pause() and then .resume() or .play() in my functions function down() { myTimeline.pause(); var downTween = new TimelineMax() .add(TweenMax.to("#box1", 2, {scale:1, rotation:"-=30", ease: Back.easeOut} )) .add(TweenMax.to("#box2", 2, {y:"+=40", autoAlpha:1, scale:1, ease: Linear.easeOut} )) } myTimeline.resume(); 2) I tried to use onComplete function down() { myTimeline.pause(); var downTween = new TimelineMax(onComplete:myTimeline.resume()) .add(TweenMax.to("#box1", 2, {scale:1, rotation:"-=30", ease: Back.easeOut} )) .add(TweenMax.to("#box2", 2, {y:"+=40", autoAlpha:1, scale:1, ease: Linear.easeOut} )) } I don't know why nothing works. What do I do wrong? Can anybody give my some explanation, please? Thanks a lot in advance. Peter
-
It seems like you could replace all of your setTimeout and setIntervals in your code using something simple like: var foo=0; TweenMax.to(foo, 1, { onComplete:function(){ // do something } }); Of course you could use repeat:-1 and onRepeat to make this a setInterval, too. Note that I Tween a generic variable as opposed to a DOM element to avoid the cost of accessing the DOM. Now this comes with several benefits such as the ability to pause, resume, or even killing all timers with a one-line command (which is very useful for me). I made a DOM-based webgame that is entirely timer and event driven, meaning that it was designed without using any game loop at all. Upon discovering the ability to use something like TweenMax.pauseAll(), I realized it would actually be possible to pause all animations, and even timers, if I changed my setTimeouts to TweenMax timers instead. Implementing a pause feature in my game would be a pretty big deal. So is this a good idea? I also noticed that chained setTimeouts tend to lose their timing while TweenMax does not. For example I have button timers that indicate the number of seconds remaining until a skill button is ready to be used, and it updates the seconds remaining every second. In reality the setTimeout is actually running a little bit late depending on how busy the processor has been, but if I use TweenMax timers, it will always be very precise and every second is almost exactly one second of delay (notably, setInterval does not appear to suffer from this timing problem). I particularly noticed this when I developed analog clocks for my website at work and I noticed that all four clocks kept absolute perfect timing no matter how much was going on or how long the webpage was running. Very cool. Any thoughts or feedback on this? I have over 1000+ setTimeouts/setIntervals throughout 70,000+ lines of code so this would be a drastic re-work. -
Hi, I am trying to work out best practice to pause another play another timeline. I have included 2 attempts with the first commented out. Ideally i would like it to run so that in the sequence of the first timeline (tl1) it resumes the paused timeline (tl2). I'm not sure if this means that an onComplete need to be added or whether it can just be a command in the timeline. e.g. .from("object", 1, {})... .from("object", 1, {})... .resume("tl2") .from("object", 1, {})... Sorry if the syntax is incorrect just trying to explain my problem. Any help is appreciated. Thank you, Phil
-
Hi there! So the issue that I'm running into is that I am trying to pause all of the tweens that are .isActive(). This works for all tweens that are actively tweening, but not those that have a delay on them. They will then play while everything else if paused. So what I'm looking for is a way to get .isActive() that includes delayed tweens. Any help? Some background: Originally, I was using .pauseAll(true, true), and .resumeAll(true, true). And that worked as expected, except I couldn't continue using that method because I can't resume all tweens because some will need to be resumed, and some will still need to remain paused. So now I'm using getAllTweens(), and then storing off only the active ones using .isActive() and then using .pause() and .resume() on only those that are stored off. Is there a way for .pause() to behave more like .pauseAll() or is there some other way that would work? Thanks! This is using TweenMax and as2. I'm not using TimelineMax, nor can I for this project.
-
Hi all, I've searched and searched to no avail for help with my problem. I need to be able to pause some animations while others continue to play. And then resume them again when needed. And this needs to be done with TweenMax (I cannot use TimelineMax). And AS2. Ideally, there would be an easy way to create a function that I pass the movieclip location & whether or not it should be paused. Something sort of like this? public function pauseMC (MC:MovieClip, State:Boolean):Void{ if (State){ MC.pause (); }else{ MC.resume (); } } Thanks for any help! -Zach
-
Hi I'm building an infinite horizontal image slider that slides when the user hovers over a 'next' or 'previous' buttons. The design requires the animation to gradually pause/resume with a subtle easing and not pause immediately. the only solution I found was to use an infinitely repeating tween for the slider, and attach a second tween to the buttons that tweens the 'timeScale' of the original tween with an easing. Is there a simpler native way to do so without creating a second tween? Thanks
-
i was trying to figure out, if possible, how to chain an instance of multiple tweens. For example: var tween1 = TweenMax.to('#image1', 3, {css:{scale:1.5}, ease:Linear.easeNone}); var tween2 = TweenMax.to('#slide1', 3, {css:{opacity:1}, ease:Linear.easeNone}); The above works.. but couldn't i just chain them, like below? var tween1 = TweenMax.to('#image1', 3, {css:{scale:1.5}, ease:Linear.easeNone}) .to('#slide1', 3, {css:{opacity:1}, ease:Linear.easeNone}); But when i try this, the browser throws an error: TypeError: TweenMax.to(...).to is not a function The reason i'm asking is because if i have to pause the animation i have to basically use the below: $('#slider').on("mouseenter",function(){ tween1.pause(); tween2.pause(); }).on("mouseleave",function(){ tween1.resume(); tween2.resume(); }); I have to declare pause and resume twice. If i had multiple tweens in one instance, i could declare pause() and resume() only once. How do i create an instance (reference variable) for multiple tweens? Thanks ahead of time for any help!
-
I'm pausing timelines with pause() and resuming them with resume(). However, is as if the timeline is dragged out when it resumes, and labels no longer line up with the tweens contained in the timeline. I've traced most of the properties, and the only ones that seem to be different are duration and totalDuration which are increased by the amount of time spent while the timeline was paused. The startTime does not change. Is this behavior normal? How can I make it so that my tweens and timelines are the right length and the labels line up after pausing and resuming? At the same time, I'm also calling TweenMax.pauseAll() and TweenMax.resumeAll(), could this be affecting the timelines(I did not give them any parent)? I'm using AS3 version 1.64 of the Tweening Platform v11. Thanks for any help.
-
Hi I am working on an AS3 slideshow developed with TweenLite10 I need to be able to pause/resume the slideshow Is there an example/tutorial explaining how to add TweenMax10 pause() / resume() functionality to a project? Thanks
