在Vanilla JS中平滑水平滚动

function smoothScroll(element, targetPosition, duration) {
  const startPosition = element.scrollLeft;
  const distance = targetPosition - startPosition;
  const startTime = performance.now();

  function scrollAnimation(currentTime) {
    const elapsedTime = currentTime - startTime;
    const scrollProgress = Math.min(elapsedTime / duration, 1);
    const scrollDistance = distance * scrollProgress;
    element.scrollLeft = startPosition + scrollDistance;

    if (scrollProgress < 1) {
      requestAnimationFrame(scrollAnimation);
    } else {
      // 滚动结束后执行回调函数
      // do something...
    }
  }

  requestAnimationFrame(scrollAnimation);
}

const container = document.querySelector('.container');
const targetPosition = 500; // 目标滚动位置
const duration = 1000; // 持续时间

smoothScroll(container, targetPosition, duration);