我尝试设置此website的初始比例。

我尝试了这个:

document.body.style.zoom = '0.8';


还有这个:

document.body.style.webkitTransform = 'scale(0.8)';


不幸的是,时间栏的滑块失去了其功能。有人知道为此工作吗?谢谢大家的想法。

更新:新方法:

var metaTag=document.createElement('meta');
metaTag.name = "viewport"
metaTag.content = "width=device-width, initial-scale=0.8, maximum-scale=0.8, user-scalable=0"
document.getElementsByTagName('head')[0].appendChild(metaTag);


在这里,什么都没有发生。

编辑:另一种方法:

document.querySelector("meta[name=viewport]").setAttribute(
          'content',
          'width=device-width, initial-scale=0.8, user-scalable=no');


不幸的是没有成功。

最佳答案

要设置初始比例,您需要在元数据中调整视口。

目前,您的元标记将小数位数设置为1

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


将1.0更改为0.8,它应该进行相应的调整。

 <meta name="viewport" content="width=device-width, initial-scale=0.8" />


对于它的价值,我使用浏览器窗口调整了它的大小,当我单击按钮时,缩放仍然可以正常工作。
(即使在全屏模式下,该栏也似乎无法正常工作;我有一台15英寸的笔记本电脑,并且该栏滑块不起作用,但是按钮有效;您可能隐藏了该栏?)

希望这可以帮助

编辑

user-scalable的允许值为yes或no,不是0和1。
如果您希望用户不可扩展,则将其设置为no。同时设置initial-scalemaximum-scale

重新编辑

有关如何使用jquery编辑元标记的信息,请参见https://stackoverflow.com/a/9232064/1675954

JavaScript解决方案:遵循以下语法

document.querySelector('meta[name="viewport"]').setAttribute("content", _desc);


另请参见this article有关媒体查询的更新

09-17 14:22
查看更多