Hey there! I'm adding a new logo carousel feature to a site. However, after removing a column from one of the logo lists and adjusting the X distance in the iteration to adapt to the new width, I'm experiencing an abrupt effect after a while. Here is the read-only link to the project. Does anyone know why this could be happening?
Thanks for the quick reply ! Perhaps it is only on my end but I see this when the first loop is about to end.
hey ed, From your screen recording I can see you’re previewing on a much larger screen then mine. So the problem is that two copies of the logo list are not enough to cover the distance before you have the animation returning back to the intitial state. The solution that worked for me was to duplicate your logo list a third time so you have 3 identical logo lists rather than two. That covers the larger screen space.
Alternatively I would set a max width of the whole component and add a div overlay to either edge so the logos fade in and out like this
This is a very good alternative. I've used this on other sites previously, and it integrates more tidily with the rest of the page content. This solution also solves the issue of the logo appearing abruptly on the right, which looks much better.
