Home > Article > Web Front-end > How to change the window size in js? How to change the window size in js

How to change the window size in js? How to change the window size in js

云罗郡主Original: 2018-11-06 17:50:4415343browse

The content of this article is about how to change the window size in js? The method of changing the window size in js has certain reference value. Friends in need can refer to it. I hope it will be helpful to you.

In JavaScript, you can use the resizeTo() method or resizeBy() method of the window object to change the size of the window.

1. resizeTo() method

Syntax: window.resizeTo(x, y)

Description:

x means The changed horizontal width, y represents the changed vertical height. The units of x and y are both px. The browser comes with its own units. We only need to use numerical values.

Example:

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script type="text/javascript">
        function resizeWindow()
        {
            window.resizeTo(200,200);
        }
    </script>
</head>
<body>
    <input type="button" value="改变大小" onclick="resizeWindow()"/>
</body>
</html>

The effect is as follows:

2. resizeBy() method

Syntax:

1window.resizeBy(x, y)

Description: When the values of x and y are greater than 0, it is expanded, and if it is less than When 0, it is reduced. The units of x and y are both px.

x represents the value of each expansion or reduction of the window in the horizontal direction, and y represents the value of each expansion or reduction of the window in the vertical direction.

The difference between resizeTo(x,y) and resizeBy(x,y) is that: x and y in resizeTo(x,y) are "changed" values, while in resizeBy(x,y) x, y are "increasing or decreasing" numerical values. "To" means a result, and "by" means a process. You will understand if you think about the English meanings of "to" and "by" carefully.

Example:

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script type="text/javascript">
        function resizeToWindow() {
            window.resizeTo(200,200);
        }
        function resizeByWindow() {
            window.resizeBy(50,50);
        }
    </script>
</head>
<body>
    <input type="button" value="resizeTo" onclick="resizeToWindow()"/>
    <input type="button" value="resizeBy" onclick="resizeByWindow()"/>
</body>
</html>

The preview effect in the browser is as follows:

How to change the window size in js? How to change the window size in js

Analysis:

We first click "resizeTo ” button sets the current window width to 200px and the height to 200px. Then every time we click the "resizeBy" button, we will find that the width and height of the current window will increase by 50px. This is all due to the result of window.resizeBy(50,50).

The above is a complete introduction to how to change the window size in js? How to change the window size in js. If you want to know more about JavaScript tutorial, please pay attention to the PHP Chinese website.

The above is the detailed content of How to change the window size in js? How to change the window size in js. For more information, please follow other related articles on the PHP Chinese website!

Statement：

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Previous article：How to check if a JavaScript object is emptyNext article：How to check if a JavaScript object is empty

See more

How to change the window size in js? How to change the window size in js

Related articles