我试图根据屏幕宽度限制Grid列的数量(使用jQuery Mobile-http://demos.jquerymobile.com/1.4.2/grids/)。这是针对无法扩展的全屏应用程序,因此不需要响应式设计。

举个例子,如果将应用程序加载到iPhone 3GS(320w x 480h)上,则希望将其限制为仅两列。如果加载到Samsung S3(720w x 1280h)上,则限制为4列。等等。

考虑使用JS document.width或width.screen.width属性,但发现它们太不一致了。在运行Android的Samsung Galaxy S3上,本机浏览器报告屏幕宽度为720px,Chrome浏览器报告为320px。

添加和删​​除视口元标记对JS的width值没有影响。

元名称=“ viewport” content =“用户可缩放比例=否,初始比例= 1.0,最大比例= 1.0,最小比例= 1.0”

也没有使用setTimeout延迟查找。

我正在使用的jQuery版本:

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.css" />
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.js"></script>


有没有办法用CSS做到这一点?

谢谢。

[编辑]

不太确定这是我正在构建的应用程序的问题。在受影响的Android版本上的Google Chrome中,看到4列而不是5列肯定是“正常失败”。

最佳答案

<meta name="viewport" content="width=device-width, target-densityDpi=device-dpi">


查看是否可以解决此问题。星系正在渲染一半像素,以便允许设备图形卡本身渲染清晰度,而不是从设备移动时使用屏幕宽度确定设备类型的站点连续获取桌面网站。

07-26 01:15