如何在javascript中平滑地左右滚动按钮？

// 获取滚动容器和左右滚动按钮
const container = document.getElementById('container');
const leftButton = document.getElementById('left-button');
const rightButton = document.getElementById('right-button');

// 设置滚动距离和滚动速度
const scrollDistance = 200; // 每次滚动的距离
const scrollSpeed = 10; // 滚动的速度

// 左滚动按钮点击事件监听器
leftButton.addEventListener('click', () => {
  smoothScroll(-scrollDistance);
});

// 右滚动按钮点击事件监听器
rightButton.addEventListener('click', () => {
  smoothScroll(scrollDistance);
});

// 平滑滚动函数
function smoothScroll(distance) {
  const start = container.scrollLeft; // 获取起始滚动位置
  const end = start + distance; // 计算目标滚动位置

  let current = start; // 当前滚动位置

  function scroll() {
    // 计算下一帧滚动位置
    current += (end - start) / scrollSpeed;

    // 更新滚动位置
    container.scrollLeft = current;

    // 判断是否达到目标位置
    if ((distance > 0 && current < end) || (distance < 0 && current > end)) {
      // 继续滚动下一帧
      requestAnimationFrame(scroll);
    }
  }

  // 开始滚动
  scroll();
}