我正在使用 JavaScript 片段根据浏览器窗口的宽度设置视口元标记的内容参数。该脚本几乎完成了它应该做的事情:它将任何大屏幕设备的初始比例值设置为 1,将纵向模式下的 iPad 设置为 0.5,并将任何屏幕宽度小于 700px 的设备设置为 1。但是,它似乎忽略为 iPad 横向模式指定的值:0.75。我怀疑我在横向模式下错误地设置了宽度条件。我正在使用 (width = 900)(用于计算 iPad 的 1024px 分辨率,并为类似屏幕尺寸的其他设备提供额外的堤坝) - 但在我的 iPad 上,横向模式会将页面缩小到 0.5(应用下一个条件)。
问:需要进行哪些修改才能使其在 iPad 横屏模式下工作?
这是片段:
<script type="text/javascript">
var width = screen.width;
var meta = document.createElement("meta");
var head = document.getElementsByTagName("head")[0];
if (width >= 1100) {
meta.setAttribute("name", "viewport");
meta.setAttribute("content", "width=device-width, initial-scale=1");
head.appendChild(meta);
} else if (width < 1100 && width >= 900) { // iPad in landscape mode
meta.setAttribute("name", "viewport");
meta.setAttribute("content", "width=device-width, initial-scale=0.75");
head.appendChild(meta);
} else if (width < 900 && width >= 700) { // iPad in portrait mode
meta.setAttribute("name", "viewport");
meta.setAttribute("content", "width=device-width, initial-scale=0.5");
head.appendChild(meta);
} else if (width <700) { // anything smaller than 700px in width
meta.setAttribute("name", "viewport");
meta.setAttribute("content", "width=device-width; initial-scale=1; maximum-scale=1");
head.appendChild(meta);
};
</script>
None
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)