网页是 - http://schnell.dreamhosters.com/spriteanimate.html
只需转到该页面并“查看源代码”，您就会看到所有代码。
现在很简单。右箭头键让 X 向右走，左箭头键让他向左走。他在正确的方向上制作了一个奔跑的动画，而实际的图像元素也朝着相同的方向移动。
我现在遇到的主要问题是优化。如果你稍微玩一下它，你会发现运行的动画并不总是流畅的，并且在最初的几秒钟里感觉非常滞后，就像它仍在加载某些东西一样。向左走的动画对此尤其内疚。另一个问题是来自 jQuery 的 .animate()。它做了一种走走停停的 Action ，你可以看出来。图像元素的运动是生涩的，不是很流畅。
来自 jQuery 的 .animate() 可以通过缓动等方式进行调整，但我不完全确定这是否是答案，而且这仍然给我留下偶尔的运行延迟或其他问题。那么有人有什么建议吗？
最佳答案
为 sprite 图像使用图像预加载，或者更好的是，使用一个图像作为 sprite，而不是交换图像文件，移动图像文件的位置。您需要将图像设置为背景图像并移动背景位置以实现此目的。
另外，使用linear easing，否则会默认swing，缓慢进入和退出。
关于javascript - 我如何使这个 Javascript/jQuery 动画更好？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/8060565/