基于速度而非时间的CSS动画？

我有以下CSS动画：

.wrapper {
  position: absolute;
  top: 100%;
  left: 50%;
  width: 400px;
  margin-left: -200px;
  font: 300 30px/1 'Open Sans Condensed', sans-serif;
  text-align: center;
  text-transform: uppercase;
  color: #fff;
  animation: 60s credits linear;
}

@keyframes credits {
  0% {
    top: 100%;
  }
  100% {
    top: 0px;
    transform: translateY(-110%);
  }
}

我需要根据“速度”而不是“时间”来改变这一点

我正在制作动画的内容大小可以改变1000%以上。以小尺寸设置内容动画可能会使其滚动非常慢。事实恰恰相反

---

有人能想出我看过的解决办法吗

不是一个完整的解决方案，但如果内容基于视口大小，则可以在媒体查询中更新

动画持续时间来增加/减少该值。
内容大小如何变化？你在任何地方都有演示吗？我在div中添加文本，并像电影字幕一样滚动，但是名字的数量，每一行，可以是一到几千个。我编辑了这个代码笔，使其具有相同的动画CSS，您可以看到它的速度大大加快或减慢，这取决于div中的内容量。