У меня есть эта проблема. Я знаю, что это хорошо известная ошибка, но я не смог ее исправить. Итак, у меня есть карусель со следующей структурой: ![enter image description here](https://i.stack.imgur.com/g8y7n.png)
Наличие eventListener
на карусели (перетаскивание) создает эффект замедленного скольжения. Но если я преобразую style.left
, то задержки не будет.
carousel.ondragstart = this.dragStart;
carousel.ondrag = this.drag;
carousel.ondragend = this.dragEnd;
Это отлично работает:
dragStart = (e) => {
this.startX = e.clientX;
}
drag = (e) => {
this.carousel.style.left = `${-this.elementIndex * this.album.clientWidth - (this.startX - e.clientX)}px`;
}
dragEnd = (e) => {
this.carousel.style.left= `${-(++this.elementIndex * this.album.clientWidth)}px`;
}
Это имеет лаг:
dragStart = (e) => {
this.startX = e.clientX;
}
drag = (e) => {
this.carousel.style.transform = `translate3d(${-this.elementIndex * this.album.clientWidth - (this.startX - e.clientX)}px,0,0)`;
}
dragEnd = (e) => {
this.carousel.style.transform = `translate3d(${-(++this.elementIndex * this.album.clientWidth)}px,0,0)`;
}
Есть идеи?