我有 2 张图像在彼此之上。当顶部的移动到不同的位置时，它们都变得有点扭曲/模糊。一秒钟后，图像恢复正常。
我该如何阻止这种情况发生？
问问题
351 次
3 回答
1
图像的实际尺寸为 140 x 198。您正在将其缩小并扩大到不同的尺寸。由于光栅图像的工作方式，这会导致模糊和/或失真。使用更大的源图像、更高的 DPI，或者不要将其扩展超出源图像的基本尺寸。
否则，任何 javascript 动画的感知“流畅度”都非常依赖于客户端计算机的资源。如果您的浏览器线程在内存上运行过高（Firefox+Firebug 可以在工作几个小时后膨胀高达 1gb 的常驻 RAM 消耗！），或者如果您的系统没有很多可用资源可供启动，动画可以生涩，屏幕渲染可能很慢或有故障。
除了缩放引起的失真之外，您的动画在我自己的计算机上运行流畅（我有很多资源可以使用：P）
文档
- 维基百科上的光栅图形- http://en.wikipedia.org/wiki/Raster_graphics
于 2012-08-31T20:40:51.647 回答
0
将黑卡的大小调整到所需的尺寸。您正在使用 600 像素宽的原件并将其缩小到 75 像素宽；这就是失真的原因。
于 2012-08-31T20:41:01.930 回答
0
我的猜测是浏览器不会对黑卡进行反锯齿处理，因为它不在视图中。在动画期间，浏览器正在快速更新蓝卡的位置和比例。作为一种性能指标，抗锯齿可能会被推迟，直到浏览器有足够的空间来超越紧密的 setTimeout 循环所提供的空间。
于 2012-08-31T20:48:00.440 回答