How to animate to an element?

[elschnuppero]

Hi there,

 

i'm currently building a site, where the user is scrolling through content horizontally (yeah i know, its a client request). In this content i implemented some aweful scrollstops with "overflow: hidden" on body & html (yeah, i know again, tell the client pls :)) 

 

The user can remove the  "overflow: hidden" by clicking a button and the protagonist in the scene will be animating to a certain point and then keeps on scrolling.

 

The problem i have  is: The scrollstops arent very reliable and it can happen - depending on the scrollspeed - that the triggerelement triggers the scrollstop too late. This reduces the space to the point where the protagonist in the scene is animating to and this is why i whonder if there is a possibility to animate to a certain element and not with values? (right now in this second i realised that i just could calculate the value between the two elements somehow, but maybe there is an easy way to this problem)

 

Thank you

See the Pen GELNRo by ElSchnuppero (@ElSchnuppero) on CodePen

[PointC]

Hi @elschnuppero

 

Welcome to the forum.

 

I'm not sure I completely understand the question and it seems to be more about ScrollMagic rather than GSAP. That being said, if you want to tween to a specific div, the ScrollTo plugin can take care of that for you and you can easily scroll horizontally.

 

https://greensock.com/docs/Plugins/ScrollToPlugin

 

Hopefully that helps. Happy tweening.

 

[elschnuppero]

Thank you for your response.

 

Its a little bit tough to explain. The issue is not related to scrollmagic. I dont want to scroll to a div (but i will probably rely on that in case i dont find another solution), i want an object animate to a div thats not necessarily having the same distance to the object (the distance might relate to the scrollspeed of the user).