以下是一个示例代码，演示了如何使用JavaScript实现按钮从左往右滑动的效果：

HTML代码：

  

    按钮1
    按钮2
    按钮3
    按钮4
    按钮5
  

CSS代码：

.wrapper {
  overflow: hidden;
  width: 300px;
}

.slider {
  display: flex;
  transition: transform 0.5s ease-in-out;
}

button {
  flex: 0 0 100px;
  height: 50px;
  margin-right: 10px;
}

JavaScript代码：

const wrapper = document.querySelector('.wrapper');
const slider = document.querySelector('.slider');
const buttons = Array.from(document.querySelectorAll('.slider button'));
const buttonWidth = buttons[0].offsetWidth + 10; // 按钮宽度 + margin-right

wrapper.addEventListener('mouseover', () => {
  slider.style.transform = `translateX(-${buttonWidth}px)`;
});

wrapper.addEventListener('mouseleave', () => {
  slider.style.transform = 'translateX(0)';
});

这段代码的关键部分是mouseover和mouseleave事件的监听器。当鼠标悬停在.wrapper元素上时，通过改变.slider元素的transform属性，使其向左平移一个按钮的宽度。当鼠标离开时，将transform属性重置为0，使.slider元素回到原始位置。

需要注意的是，这里使用了CSS的transition属性来实现平滑的过渡效果。