Search the Community
Showing results for tags 'setinterval'.
Found 7 results
-
How i can perform something like this with gsap3 ? pointerDown(e){ gsap.delayedCall(1, ()=>{ contex.startScroll() }, id); } pointerout(e){ // somewhere with other contexts, needed getbyid gsap.getById(id)?.kill(); } i cant find anymore killDelayedCallsTo for gsap3 doc https://greensock.com/docs/v2/TweenMax/static.killDelayedCallsTo() Is it renamed ? I can perform this with timeout or special ticks in my renderer but i search for the most shorted code and easy code. Thanks
-
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. -
I have a timeline which moves the x position of a really long div to the left. When you hover over a button it will trigger the timeline. However, I can't seem to get the timeline to move continuously. I've tried setting a repeat and an onComplete function to loop the timeline but neither of them worked. I did manage to move the long div using setInterval but when you mouse leave the button the tween animation doesn't stop instantly. Here is a codepen of the setInterval example - http://codepen.io/anon/pen/GZvLVp and here is a codepen of the timeline example - http://codepen.io/anon/pen/BKdeBQ I guess ideally I would want to use a timeline so I can pause the animation on button mouseleave right?
- 6 replies
-
- 1
-
-
- tweenmax
- setinterval
- (and 1 more)
-
Alright, another question Greensock Guys... Was having a look at the Served ping-pong site the other day, have a look at it here: http://www.served-mcr.com/ Great site, loving the animation in it. Noticed they're using TweenMax and Scrollorama among other scripts, nice. I was interested in the tiny background animations they've included. I created something very similar a while ago with CSS Animations and Keyframes, and in the spirit of cross-browser compatability I wanted to recreate it with JS. I've been hearing more and more lately about animated PNG's using this method (as opposed to an Animated PNG, or Firefox's APNG). I get how they're using setInterval to call an individual .png file every x second to create the illusion of an animation, which is pretty cool, and a huge time/file-size saver when compared to say using .gif's, but I haven't been brave enough yet to try and create something similar with the GSAP. If any of you guys have the time could I ask for any suggestions or examples of how this might be done with Greensock? I've included some makeshift assets for you to use, just five images of squiggly lines you could use to trigger through, if that makes it easier Appreciate any help you boys have. Cheers
-
hello hello.. i know instead of using setInterval(), we can use delayedCall() for GSAP.. what would be the clearInterval() equivalent in GSAP. In setInterval() when you declare it in a variable, returns an ID (unique identifier) which is used in clearInterval() to cancel the timer var intervalID = window.setInterval(animate, 500); // later called to cancel the timer window.clearInterval(intervalID); so my question is.. what is the equivalent in GSAP to cancel a specific delayedCall() instances... since if i use killAll() //kill only delayedCalls TweenMax.killAll(false, false, true, false); it kills all delayed calls, but not just a specific delayedCall().. I could use killDelayedCallsTo() which kills all of the delayedCalls to a particular function.. but is there a method to kill specific instances of delayedCalls that might have multiple delayedCall() being used, like when using clearInterval? does delayedCall() return a unique identifier like setInterval() does to reference later for cancelling / killing? Below i can use the following to cancel timers at different times due to the instances referenced with the setInterval() .. var intervalID = window.setInterval(animate, 500), intervalID2 = window.setInterval(animate, 1000); // later called to cancel timer 1 window.clearInterval(intervalID); // called again later to cancel timer 2 window.clearInterval(intervalID2); so what would be the equivalent to cancelling the delayedCall() on different instances like above using setInterval().. instead of cancelling all tweens associated with a function that you pass to killDelayedCallsTo() ?let me know if i need to clarify more, and if the way im explaining my question is long winded?
-
Hi, We're using TimelineMax and TweenMax to make a scrollable timeline animation. Everything is going great except when leave the tab open and navigate away to another tab, which causes chrome to (I'm not sure on this one) suspend or slow down timers from 'ticking'. When you navigate back to the tab, we're seeing erratic behavior that will show random pieces of our timeline all stacked up on top of each other (http://screencast.com/t/vC00sJHXCkCT). I've tried to use https://github.com/ai/visibility.js to set the timeline progress to zero whenever a user activates the tab again, but the behavior still exists. Steps to create: 1. go to http://alert-gum.herokuapp.com/ in chrome/firefox 2. scroll down a little bit 3. open a new tab in front of the alert tab and wait for 3 mins 4. go back to the tab and try scrolling. result: items scattered and stacked on top of each other from different points in the timeline. p.s. the issue 'kind of' fixes it's self if you scroll all the way up and all the way down (obviously not satisfactory) Thanks for any help.
-
I'm noticing that TweenLite keeps looping over some functions, even though no tweens have been initiated. Firebug's Profile shows that there are 4 functions that keep running, on lines 278, 830, 227 and 703. (TweenLite.js, dated 29.1.2013) Is there a way to kill those timers? The load they cause is really minimal, but I'd like to clean them up anyways.
