动态加载内容时,Iphone 4浏览器中的文本模糊

Question

我正在使用Jquery/Jqtouch库来实现与iPhone兼容的站点.我现在只是在iPhone 4(不是2g,3g或3gs)中遇到问题,在一个特定场景中文本变得模糊.以下是它的发生方式

1. 该网站有一个公共div容器.

   <div id="container"></div>
   

2. 容器根据用户操作动态填充内容.以下是执行此操作的功能.

   function loadPage(url, section, callback) {
      $('#container').empty();
      $('#container').load(url + ' ' + section, loadComplete(section));
   }
   

3. 一个样本调用上面的函数

   loadPage("Data.htm", "#Friends", null);
   

4. Basicaly eveything工作正常,除了在一个场景中容器上的数据量巨大(即#container高度增加到1500px +不可预测).现在,如果我用相同容器上不同选项卡的较小数据替换它,则文本变得模糊.附图是图像

http://i.stack.imgur.com/XE9q4.png

有没有人遇到过这种情况.提前致谢.

Answer 1

图形元素必须与屏幕上的像素“对齐”；坐标必须始终表示为整数值而不是浮点值。如果不是，GPU 的子像素渲染引擎会使图像变得模糊，这对于动画来说不是问题，但对于静态图像来说绝对是一个问题。

在原生 SDK 中，我们必须确保一切都对齐（例如使用 CGRectMakeIntegral()）。

由于您使用的是 Web 框架，因此很难准确地告诉您如何解决问题，但我会尝试将您的尺寸调整为精确的尺寸，而不是让框架来解决。