如何创建自动滚动？

<div id="scroll-container">
  <ul id="scroll-content">
    <li>内容1</li>
    <li>内容2</li>
    <li>内容3</li>
    <li>内容4</li>
    <li>内容5</li>
  </ul>
</div>

#scroll-container {
  height: 200px;
  overflow: hidden;
}

#scroll-content {
  list-style-type: none;
  padding: 0;
  margin: 0;
  animation: scroll 10s infinite;
}

@keyframes scroll {
  0% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(-100%);
  }
}

window.onload = function() {
  var scrollContent = document.getElementById('scroll-content');
  var scrollHeight = scrollContent.offsetHeight;
  var containerHeight = document.getElementById('scroll-container').offsetHeight;
  
  if (scrollHeight > containerHeight) {
    scrollContent.style.animationDuration = (scrollHeight / 50) + 's';
  }
};