Posted By
Bajarangi soft ,
Posted On 01-10-2020
The resizeTo() method resizes a window to the specified width and height.
Related methods:
Syntax and Usage
window.resizeTo(width, height)
Parameter Values
Parameter Type Description width Number Required. Sets the width of the window, in pixels height Number Required. Sets the height of the window, in pixels
<button class="btn btn-info" onclick="openWin()">Create window</button>
<button class="btn btn-info" onclick="resizeWin()">Resize window</button>
<script>
var myWindow;
function openWin() {
myWindow = window.open("", "", "width=100, height=100");
}
function resizeWin() {
myWindow.resizeTo(250, 250);
myWindow.focus();
}
</script>
In above example when you click button it will create new window.
Example(2)
<button class="btn btn-success" onclick="openWin()">Create window</button>
<button class="btn btn-success" onclick="resizeWinTo()">Resize the window to 800px * 600px</button>
<button class="btn btn-success" onclick="resizeWinBy()">Make the new window smaller</button>
<script>
var myWindow;
function openWin() {
myWindow = window.open("", "", "width=250, height=250");
}
function resizeWinTo() {
myWindow.resizeTo(800, 600);
myWindow.focus();
}
function resizeWinBy() {
myWindow.resizeBy(-100, -50);
myWindow.focus();
}
</script>
In above example when you click button it will create new window and even it will resize the window.
Complete Code For Use Window ResizeTo Methods With JavaScript
<!DOCTYPE html>
<html>
<head>
<title>Use Window ResizeTo Methods With JavaScript</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
</head>
<style>
h1 {
color: red;
}
</style>
<body>
<div class="container">
<div class="text-center">
<h1>Use Window ResizeTo Methods With JavaScript</h1>
</div>
<br>
<div class="well">
<button class="btn btn-info" onclick="openWin()">Create window</button>
<button class="btn btn-info" onclick="resizeWin()">Resize window</button>
<script>
var myWindow;
function openWin() {
myWindow = window.open("", "", "width=100, height=100");
}
function resizeWin() {
myWindow.resizeTo(250, 250);
myWindow.focus();
}
</script>
</div>
</body>
</html>