lucky111 Posted February 21 Share Posted February 21 Is it a way to build this elastic header effect with gsap? When I try this in my iphone it is a litle bit flicking. My be we can geting it to work better with gsap See the Pen NqrYQL by olach (@olach) on CodePen Link to comment Share on other sites More sharing options...
Rodrigo Posted February 21 Share Posted February 21 Hi, I would start by trying the Observer Plugin and use the onDrag callback with the current scroll position. Or perhaps Draggable with the Inertia Plugin and a proxy that is triggered by the body element or a main container. The real challenge here is the overshoot behaviour, doing this when the window scroll is at the top is super easy, but when is not... you'd have to check the Inertia Plugin in order to see the final destination of the throw instance and based on that and the screen size calculate the final scale value of the image container. Another option would be to check Inertia Plugin's velocity tracker in order to see if that helps with the overshoot behaviour- As I mentioned this is not a simple task but with enough custom logic it can certainly be achieved. Unfortunately is a bit beyond the help we can provide in these free forums, you can contact us for paid consulting services or post in the Jobs & Freelancing forums in order to get help there. Happy Tweening! Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now