首頁 >web前端 >js教程 >js怎麼改變視窗大小?js改變視窗大小方法

js怎麼改變視窗大小?js改變視窗大小方法

云罗郡主原創: 2018-11-06 17:50:4415374瀏覽

這篇文章帶給大家的內容是關於js怎麼改變視窗大小?js改變視窗大小方法，有一定的參考價值，有需要的朋友可以參考一下，希望對你有幫助。

在JavaScript中，可以使用window物件的resizeTo()方法或resizeBy()方法來改變視窗的大小。

一、resizeTo()方法

語法：window.resizeTo(x, y)

說明：

x表示改變後的水平寬度，y表示改變後的垂直高度。 x和y的單位都是px，瀏覽器自帶單位，我們只需要使用數值即可。

範例：

<!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>

效果如下：

二、 resizeBy()方法

語法：

1window.resizeBy(x, y)

說明：當x、y的值大於0時為擴大，小於0時為縮小。其中x和y的單位都是px。

x表示視窗水平方向每次擴大或縮小的數值，y表示垂直方向視窗每次擴大或縮小的數值。

resizeTo(x,y)與resizeBy(x,y)不同在於：resizeTo(x,y)中的x、y是「改變後」的數值，而resizeBy(x,y)中的x、y是「增加或減少」的數值。「to」表示一個結果，「by」表示一個過程，大家好好琢磨「to」和「by」的英文意義就懂了。

範例：

<!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>

在瀏覽器預覽效果如下：

js怎麼改變視窗大小?js改變視窗大小方法

分析：

我們先點選「resizeTo 」按鈕把目前視窗寬度設定為200px，而高度也設定為200px。然後每當我們點擊1次「resizeBy」按鈕，就會發現目前視窗的寬度和高度都會增加50px。這樣都是由於window.resizeBy(50,50)的結果。

以上就是對js怎麼改變視窗大小?js改變視窗大小方法的全部介紹，如果您想了解更多有關JavaScript教程，請關注PHP中文網。

以上是js怎麼改變視窗大小?js改變視窗大小方法的詳細內容。更多資訊請關注PHP中文網其他相關文章！

陳述：

本文內容由網友自願投稿，版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容，請聯絡admin@php.cn

上一篇：如何檢查JavaScript物件是否為空下一篇：如何檢查JavaScript物件是否為空

看更多