I'm creating a simple slide with the scroll, but the problem is when the 'mouseup' event happens, the animation scroll-behavior: smooth; that I programmed in css. I also added the transition in my React code to try to solve the problem, and it didn't help.
The event I expect is that when the pointer is being dragged, the panel animates the scroll with the smooth event. And what is happening now and when you release the cursor the scroll has no animation and happens quickly in the blink of an eye. I hope you understood.
https://stackblitz.com/edit/nextjs-rzaxxp?file=components%2FScrollSlide.jsx
The goal is a bit unclear and your explanation is not easy to follow, however, if you just want to create a slider/carousel, don't try to invent the wheel, you could just simply use SwiperJS.
I'm using it for quite some time and so far this is the best slider/carousel I've ever used.
Easy to set up, great examples, available for vanilaJS, React/Next, Angular, Vue...