I am playing around with Javascript and I made a carousel that is responsive to touch events. It works and looks great except that you can slide past the first and the last elements. I have been stuck on this for days and I don’t know how to go about making this right. If you slide left at the beginning of the carousel it goes left till you get a blank space same for the last element. I am trying to make it impossible to slide past those two elements. I tried to use CSS to set the touch action to none but that doesn’t work too.
The code is on jsfiddle https://jsfiddle.net/jqs62tp1/
Has anyone done this before? I would really appreciate some tips on moving forward.