在 div 中自动滚动

Question

我尝试自动滚动这个 div，但我卡住了，因为我不能做我想做的事。 这个 sn-p 是从 Stackoverflow 检索到的，它通常应该水平移动。但是我的目标是垂直制作。

我该怎么做？

const flavoursContainer = document.getElementById('flavoursContainer');
const flavoursScrollHeight = flavoursContainer.scrollHeight;

window.addEventListener('load', () => {
  self.setInterval(() => {
    if (flavoursContainer.scrollTop !== flavoursScrollHeight) {
      flavoursContainer.scrollTo(flavoursContainer.scrollTop + 1, 0);
    }
  }, 15);
});

.container {
  height: 100px;
  overflow-x: scroll;
  white-space: nowrap;
  background-color: #fff;
}

<div class="container" id="flavoursContainer">
  <div class="element">test</div>
  <div class="element">test</div>
  <div class="element">test</div>
  <div class="element">test</div>
  <div class="element">test</div>
  <div class="element">test</div>
  <div class="element">test</div>
  <div class="element">test</div>
  <div class="element">test</div>
</div>

Answer 1

你需要使用scrollTo(x, y)方法的第二个参数。

例如：

flavoursContainer.scrollTo(0, flavoursContainer.scrollTop + 1);