set Relative Animation End Point responsive

[Sameer Khan]

Hi there i am new to Greensock and have created this animation with TweenMax and CustomWiggle , 

 

I wanted to ask you that I want the Ball from Logo to The Word Hello.( To the Dot of The Hello.) I Achieved it but the main problem is the position of the ball remain constant when i decrease Screensize , i want to ask How can i achieve this that take ball from logo and after Bounce ends , I want to make that ball goes into the Hello(Dot) and remain its position fixed with the Hello so when i move to the Smaller Screens i want to go the ball to that point ,.... Please Help i wwant it Responsive for All Devices so Help me.

 

 

I Hope you Understand the Question Please find animation in above codepen link 

See the Pen aMGrKV by pixelswd44 (@pixelswd44) on CodePen

[Dipscom]

Hi Sameer,

 

Welcome to the forums.

 

To achieve what you are after what you need to do is make sure that none of the transforms applied to your tweened element are left at the end of the animation. For that you want to use clearProps - have a read in the CSSPlugin documentation.

 

Another thing you want to do to make your life easier is to animate .from(), rather than .to(). Working backwards with your animation will help you as you will know where the element end as soon as you start working. Rather than creating the whole thing and, at the end, trying to make sure it lines up with your design.

 

See the Pen wOXwZB by dipscom (@dipscom) on CodePen

 

Happy Tweening!