如何使用javascript调整（宽度/高度）网页的大小？答案

【问题标题】：How to resize (width / height) web page using javascript?如何使用javascript调整（宽度/高度）网页的大小？
【发布时间】：2015-12-28 16:06:43
【问题描述】：

如何使用javascriptresize（宽度/高度）网页？

通常我们在浏览器上使用mouse scroll wheel + Ctrl 到resize 网页。

我想知道如何使用 javascript 到 resize 网页，就像使用 mouse scroll wheel + Ctrl 一样

我搜索 javascript 函数和 stackoverflow 问题来执行此操作但未找到。

请给我建议，最好的问候。

【问题讨论】：

你说的不是resize，而是zoom，这是另外一回事。
@Yeldar Kurmangaliyev ---- 我必须从调整大小更改为放大/缩小？

标签： javascript jquery html css responsive-design

【解决方案1】：

你可以用 CSS 做到这一点：

body {
    -moz-transform: scale(0.8, 0.8); /* Moz-browsers */
    zoom: 0.8; /* Other non-webkit browsers */
    zoom: 80%; /* Webkit browsers */
}

CSS 小提琴：https://jsfiddle.net/omerblink/ff3L9hh5/

而使用 jQuery 你可以做到这一点：

$(document).ready(function(){
  $('body').css({
    'zoom': '50%'
  });
});

jQuery 小提琴：https://jsfiddle.net/omerblink/ff3L9hh5/1/

如果您需要更多帮助，请告诉我 :)

【讨论】：

我可以缩放以适应 Windows 浏览器吗？
为什么要这样做...如果您这样做是为了适应移动浏览器，那么只需在中使用元缩放
我想先尝试使用zoom。 ^_^请指教我^^

【解决方案2】：

您可以使用下面的 javascript 代码缩放网页

HTML 代码：

<body id="container">
  <button type="" onclick="zoomIn()">Zoom In</button>
  <button type="" onclick="zoomOut()">Zoom Out</button>
</body>

Javascript 代码：

 function zoomIn()
        {
            var Page = document.getElementById('container');
            var zoom = parseInt(Page.style.zoom) + 10 +'%'
            Page.style.zoom = zoom;
            return false;
        }

        function zoomOut()
        {
            var Page = document.getElementById('container');
            var zoom = parseInt(Page.style.zoom) - 10 +'%'
            Page.style.zoom = zoom;
            return false;
        }

【讨论】：