search

g787543 / infinite-react-carousel

Infinite carousel for react
https://g787543.github.io/infinite-react-carousel/
MIT License
109 stars 34 forks source link

Use CSS to perform translateX animation. #16

Open tconns opened 4 years ago

tconns commented 4 years ago

You are wonderful! Can you support running translateX with css just like react-slick? Your virtual mode if combined animation from css will be extremely good for performance! Currently position updates with javascript result in constant dom updates.

g787543 commented 4 years ago

Hi, @tconns

first, I appreciate your appreciation. second, If I use translateX like react-slick, it can't slide smoothly. I know it has a performance problem. but I need to confirm which one is needed by the user

thanks for your suggestion, I will think about it.

tconns commented 4 years ago

Thank you! I have an idea, but need your help. You try to determine only the coordinates of the slide item. The translation will be done by css, at the transfer endpoints, duation = 0, and between adjacent elements duration = setting.duration. It can slide smoothly! I hope the idea will help with this project. I see this project so wonderful! 🥇