Adjusting Infinite Auto-Scroll Slider

Ask the community
1

Hello, I used Jonathan Tsodikovitch’s approach to creating an infinite auto-scroll slider. Everything was well set as instructed but the slider couldn’t reach the container’s end point and is starting at the mid-point again for mobile and tablet versions.

I need an expert recommendation on what I am missing. This is the site URL.
https://nastarck002.editorx.io/slider

1366×663 87.9 KB

2

@jonathant any advice?

3

@jonathant I made another slider on the same website, I am still having the issue of the slides not reaching the endpoint for the smaller devices.
Probably something is wrong with the slider width.

https://nastarck002.editorx.io/slider/blank

4

@nastarck002 Hey! Happy to see that you find this useful.
Your animation looks good, the only thing is when it repeats itself.
I can’t see the code, but in general you need to do 2 things:

  1. Make a copy of your original slider (to make it look like it’s sliding in a loop)
  2. Change the sliding distance to the width of your original slider.
    Example: The original slider width is 2040px so the X distance in the code should be 2040.
    I made a drawing when your slider should restart its animation (below)

6274×1826 351 KB