I am trying to implement a slide transition between books. I’ve tried Motion, but I am getting weird animations. All I am looking for is to slide each book across the x axis when ever they are being sorted or shuffled.

I am trying to do something like this – https://www.loom.com/share/aa9e75b4d461400c9f8173240556fa24

I would like to know how to achieve this effect on scroll – https://www.loom.com/share/aea16788e5c54bff82f43ff22562db7e?sid=bf339a76-b9d6-4bcc-a16c-e623ad655323

I have an issue with the animation of my navigation bar. I am using React and Framer Motion. My result is almost there, but it still needs a little touch to make it pixel perfect. I am struggling with the animation of the links; they should be locked on the left, but mine slide in from the right. They should also reveal from left to right, one by one. Could you please check my code and suggest some improvements to achieve the desired result? Here is a short video of how it should animate: https://www.loom.com/share/d882818c384e4af18abeabf92abb2980

Here is the code for my card component:

I’m trying to build an animate like Neurable https://www.neurable.io/