Jump to content

Search In
  • More options...
Find results that contain...
Find results in...

Sara Ree

  • Content Count

  • Joined

  • Last visited

Community Reputation

0 Newbie

About Sara Ree

  • Rank
  1. it shakes a lot... I just used scale not shaking!!!
  2. Hi, I have edited the codepen... please have a look ...
  3. I'm using TweenMax and I want to create such animation provided in the Codepen. please note I want a function to start and then stop the animation. the code works fine with one issue : if you play with my Codepen you can see sometimes the pure Css animation jumps back suddenly to the initial position... I also used such a code like this but it's not soft as the pure Css animation in the code pen please help. const assistantTween = new TimelineMax(); assistantTween.fromTo(icon, 1, {scale: 1}, {scale: 1.1, ease:Elastic.easeOut,repeat:-1}); Alth
  4. Thanks for the clarification I have updated my code to : tween.fromTo(item, 1, {scale: 1}, {scale: 1.1, ease:Elastic.easeOut,repeat:-1}); The tween.reverse(0.4); does exactly what I want instead of tween.reverse(); that would go backward through all the iterations up to the start point. I'll provide a codepen to show you what I mean about GSAP 3 bug as soon as possible...
  5. I have done it like this: function Script1() { // button 1 let item = $('[aria-label="speak"] svg') tween = new TimelineMax(); tween.fromTo(item, 1, {scale: 1, ease:Elastic.easeOut, repeat:-1}, {scale: 1.1, ease:Elastic.easeOut,repeat:-1}, {scale: 1.1, ease:Elastic.easeOut,repeat:-1}); } function Script2() { // button 2 tween.reverse(0.4); } And I can't use GSAP 3: because it has different and unexpected behavior for one one my animations... maybe a bug or something ...
  6. Thanks for the instant replay... but unfortunately`tween.progress(0)` doesn't do anything and the animation continue ... and adding this: tween.progress(0); tween.pause(); jumps to the start without any animations.... I want something like reverse(); of course not for the whole timeline but for one iteration
  7. I have button 1 that initiates the pulsating animation like this: //Global variables let tween = new TimelineMax(); // button 1 code //First of all select the element let item = $('[aria-label="speak"] svg') // Start the infinite pulsating animation tween.to(item, 1, {scale: 1.1, ease:Elastic.easeOut, repeat:-1, repeatDelay:0.2}) So far so good, BUT... What if we have a second button (button 2) that reverses the iteration Not the whole timeline! I want the second button to instantly animate the pulsating element to its initial state without any jumping or jerking