JavaScript 在 <meta name="viewport" 中设置初始比例

【问题标题】：JavaScript to set the initial Scale in <meta name="viewport"JavaScript 在 <meta name="viewport" 中设置初始比例
【发布时间】：2012-06-20 02:02:41
【问题描述】：

是否可以在

之前有一个JavaScript函数

<meta name="viewport" content="width=device-width; initial-scale=1.0; ">

设置比例数字，以正确定位每个移动设备的宽度？例如在 JavaScript 中我们有

if (window.devicePixelRatio == 0.75)

我们制作元标记：

<meta name="viewport" content="width=device-width; initial-scale=1.4; ">

和

 if (window.devicePixelRatio == 1.5)

我们制作元标记：

<meta name="viewport" content="width=device-width; initial-scale= 0,75; ">

因此页面在加载时会放大或缩小，以完美适应设备宽度。

如果可以的话，请您发布一个示例。

【问题讨论】：

标签： javascript html mobile viewport

【解决方案1】：

好的，经过长时间的研究，我找到了解决这个问题的方法。我没有找到通过 JavaScript 控制比例的方法，但我找到了另一种实用的方法。我希望它对其他编码人员有用。

假设您的页面宽度为 250 像素，并且您想为 android 做一个 webview 应用程序。而且您的页面没有响应，因此您的宽度固定。你也试过了

这对你没有用。

将 .css 添加到您的页面，并根据需要调整数字。

@media screen and (max-width: 320px) { 
html { zoom: 120%; } 
}

@media screen and (max-width: 400px) { 
html { zoom: 150%; } 
}

@media screen and (max-width: 800px) { 
html { zoom: 220%; } 
}

@media screen and (min-width: 801px) { 
html { zoom: 230%; } 
}

因此，包含元素的页面很好地缩放以适应打开 webview 应用程序的 android 设备。我通过android获得的大多数宽度是240 320 400 480 533 600 800 或者你可以为每 50 或 100 计算一个缩放值 250 300 350 400 .. 等等

【讨论】：