使用元标记将页面缩放到1.0

Question

当我从HTML页面发起JS应用程序时,我使用这两个函数来设置和重置比例值.

function setMeta(){
        alert("meta set");
        oldcontent=$('meta[name=viewport]').attr('content') //store the current value
        $('meta[name=viewport]').attr('content', 'width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, user-scalable=0');
}

function resetMeta(){
        alert("meta reset");
        $('meta[name=viewport]').attr('content', oldcontent);

}

代码工作正常,除非HTML页面缩放到更大的值,它不会像setMeta方法那样设置为1.0.其他值如user-scalable工作正常.示例:在HTML页面中,我们可以扩展,但在应用程序中我们不是.

这也不起作用:document.body.style.zoom="100%"; 为什么不能将规模重新设置为1.0工作？

Answer 1

需要注意的一点是，重置视口标签时，一定要记住覆盖之前设置的视口属性。例如，如果您希望将视口标签设置为

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

在您的resetMeta()函数中，您需要将值设置回类似这样的值

<meta name="viewport" content="width=920, initial-scale=5.0, maximum-scale=5.0, user-scalable=yes" />

而不是这样的：

<meta name="viewport" content="initial-scale=5.0" />

记住不要错过任何宽度或比例。

您的示例的编辑版本：http://hosting.ambc.hostei.com/html/test.html