S3上的视口元标记无法正常工作

Question

我有一个回复网站，我想要移动电话将视口设置为320宽度。我插入了以下元标记：

<meta name="viewport" content="width=320, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>

不知何故，这个视口适用于iphone，但不适用于Galaxy S3。我用小屏幕测试了Android手机，他们也工作过。根据{{​​3}}，Galaxy G3的纵向宽度为360像素。似乎S3不会改变视口。

我还测试了它的宽度内容=“width = device-width”和content =“target-densitydpi = device-dpi”。一切都没有运气。

我在网上搜索了解决方案，但找不到合适的解决方案。

任何帮助将不胜感激！ ：）

Answer 1

我通过将meta viewport-tag更改为：

来实现它

<meta name="viewport" id="vp" content="width=device-width, user-scalable=no" />

然后我用了这个脚本：

<script>
// Set vieport to set valid width on certain Android devices
var vp = document.getElementById('vp');
if ($(window).width() <= 480) {
    vp.setAttribute('content','width=320, user-scalable=no, target-densitydpi=low-dpi');
}
else {
    vp.setAttribute('content','width=768, user-scalable=no');
};
</script>

target-densitydpi = low-dpi正在做的伎俩！只有在屏幕宽度小于480px时才会添加此项，否则平板电脑版本会显示移动版本。