Search the Community
Showing results for tags 'momentum'.
-
Hi, Any ideas how to create a tween with momentum effect? For example, in this site: http://tram-house.com / elements continue moving for a while after scrolling has stopped. Thank you in advance!
-
Hi all, Trying to make a circular nav with flick, spin and rotating properties. Got it to rotate, but it doesn't seem to flick spin with accelerating and de-accelerating momentum I've added the draggable plugin and set throwProps to true. What am I missing / doing wrong? Any help appreciated.
-
Posting this for future Google searchers: To slow down a repeating animation in GSAP so it seems like it's losing momentum until it reaches the end position, animate both the 'timeScale' and 'progress' properties! Thanks to zadvorsky and zachsaucier for their help. var spin = TweenMax.to('#group',2,{ transformOrigin: 'center center', rotation: 360, ease: 'Linear.easeNone', repeat: -1, paused: true }); document.getElementById('finish').addEventListener('click',function(){ var remaining = spin.timeScale() * ( spin.duration() - spin.time() ) * 3; TweenMax.to(spin, remaining, { timeScale: 0, ease: 'Linear.easeNone', onComplete: function(){ spin.pause(); } },0); TweenMax.to(spin, remaining, { progress: 1, ease: 'Power3.easeOut', },0); }); I haven't figured out a better way to calculate how long the slow-down animation should last. "spin.timeScale() * ( spin.duration() - spin.time() ) * 3" feels right for this animation, but three is a bit of a magic number. Any ideas on how to better calculate that?