JavaScript 栏动画

Question

我上面有这张图片。我想根据汽车的转速显示部分图像。例如，当汽车启动时，只有底部的蓝色 block 可见，随着速度的增加，更多的 block 会一直可见到红线。一旦速度降低，方 block 就会消失。我对这个不知所措，我什至不知道从哪里开始。最初我正在考虑使每个 block 成为一个单独的图像，但我想知道是否有更好的方法来做到这一点。有什么想法吗？

Answer 1

查看 Raphael JavaScript 库。根据您的 Javascript 经验，您可能会有一些学习曲线，但我认为您会更轻松地重新创建上面显示的内容并将所需的行为附加到每个形状，而不是尝试使用图像，特别是考虑到 block 的排列和方向。

更新:我创建了这个 fiddle ，因为我认为这似乎是一个有趣的练习。我只使用了矩形 block ，但是如果您将鼠标悬停在绿色“ throttle ”栏上，您将看到这些 block 是如何出现和消失的。