imChris

Hey @mikel, Taking your approach and using motionPath, I then decided to use one continuous path which seems to fit what I'm looking to achieve more so. Is there a way to keep the element centered as I'm scrolling? I'm guessing I'll have to run a function on update to set the position or is this the wrong approach? Thanks again, sorry for the repeated questions! Codepen for reference - Codepen

Hey @mikel This looks more like the effect I was looking for, Let me have a look around it and take it apart. Thanks, really appreciate your help! Chris

Hey Mikel, Thanks for that, that definitely makes things a little better, being able to control as and when it happens. My main concern is that the animation happens in three distinct parts, first the rotation, then the movement across the X axis and finally the rotation back to zero. What I'd like would be for everything to appear seamless, the three stages all merged into one essentially. I've tried setting the timings to all happen at once which is a little better but still not quite right.

Hey, So, taking the advice from Zach I rewrote the pen using scroll trigger and have roughly the effect I'm looking for. My only question now is whether I can make the movement of the div smoother, currently it goes in a few steps (rotate, then translateX and rotate back to zero). Sorry if this seems like a silly question, I did look through the docs but couldn't find any other way of doing it? I'm guessing this is where the motion path plugin comes into it? Codepen for reference - Codepen Thanks, and appreciate any pointers! C

Thanks for the heads up! I will do so and report back if i have any issues! Thanks Zach!

Hey Everyone, First post on here, such an active and awesome community though! I'm wondering if anyone can shed any light on why an element is not rotating, I guess I'm doing something incorrect, a nudge in the right direction would be amazing. As you can see in the codepen, I've got a absolutely positioned div which is meant to slide from the each of the green boxes (that's where it should land every time) what I'm struggling with is for the div to rotate to the direction it's moving to. Also, if anyone can see something drastically wrong I'm doing it would be appreciated, thanks! C