使用 JS 强制页面缩放 100% [英] Force page zoom at 100% with JS

问题描述

我在 Canvas 中创建了一个小游戏，但遇到了问题.某些将默认缩放比例设置为 100% 以外的用户无法看到整个游戏页面.

I created a little game in Canvas, but I have a problem. Some users who have the default zoom set to something other than 100% can't see the entire game page.

我曾尝试使用此 CSS:

I have tried using this CSS:

zoom: 100%;

这个 HTML

<meta name="viewport" content="initial-scale=1.0 , minimum-scale=1.0 , maximum-scale=1.0" />

还有这个 JS:

style="zoom: 75%"

任何想法如何以编程方式设置页面缩放?

Any ideas how to programatically set the page zoom?

推荐答案

您可以在页面加载时设置 zoom 属性

You can set zoom property on page load

document.body.style.zoom = 1.0

但是，zoom 是不是所有浏览器的标准属性，我推荐使用 transform 代替.

But, zoom is not a standard property for all browsers, I recommend using transform instead.

var scale = 'scale(1)';
document.body.style.webkitTransform =  scale;    // Chrome, Opera, Safari
 document.body.style.msTransform =   scale;       // IE 9
 document.body.style.transform = scale;     // General

http://jsfiddle.net/5RzJ8/

这篇关于使用 JS 强制页面缩放 100%的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！