JavaScript Window resizeBy() Method

Beginner
5 min read
Updated: Nov 2026
5 examples
Method

Definition

window.resizeBy() resizes the current window by a relative amount in pixels (MDN). It returns undefined.

Pass the required arguments shown below. Check return values and browser support before you rely on the result.

Syntax

Call window.resizeBy. Start with this line.

JavaScript
resizeBy(xDelta, yDelta)
CallWhat it does
resizeBy(xDelta, yDelta)Primary signature.
window.resizeBy(...)Call with the arguments your case needs.

Built into the browser. Call window.resizeBy(...) (or the global resizeBy(...)) — no import required.

Library declarations
JavaScript
resizeBy(xDelta, yDelta)

Parameters

ParameterDescription
xDeltaRequired. Horizontal pixels to add (or subtract)
yDeltaRequired. Vertical pixels to add (or subtract)

Return Value

Return ValueDescription
*Always undefined

JavaScript Examples

Example 1 — Basic Grow

Add width and height (may be blocked on main tabs).

JavaScript
window.resizeBy(200, 100);
// +200 width, +100 height
Try It Yourself

How It Works

  1. Pass two numbers. Width delta first, height second.
  2. Relative change. Adds to the current outer size.
  3. Browser may ignore. Common on the user’s main tab.
  4. Return. Always undefined.

Example 2 — Button Grow

Each click grows the window a little more.

JavaScript
document.getElementById("btn").onclick = function () {
  window.resizeBy(100, 50);
};
Try It Yourself

How It Works

  1. Wire a click. User gesture helps some policies.
  2. Small deltas. Easy to see repeated growth.
  3. Still relative. Each call starts from the new size.
  4. Tip. Prefer a resizable popup for demos.

Example 3 — Resize a Popup

Open a popup, then call resizeBy on that window reference.

JavaScript
let popup = null;

function openPopup() {
  popup = window.open(
    "",
    "ResizeDemo",
    "resizable,width=320,height=200,left=200,top=120"
  );
}

function growPopup() {
  if (popup && !popup.closed) {
    popup.resizeBy(60, 40);
  }
}
Try It Yourself

How It Works

  1. Include resizable. MDN: required for script resize.
  2. Store the reference. Keep the returned Window.
  3. Guard. Skip if missing or already closed.
  4. Call on the popup. popup.resizeBy(...).

Example 4 — Shrink

Negative values reduce size (MDN shrink example).

JavaScript
window.resizeBy(-200, -200);
// narrower and shorter
Try It Yourself

How It Works

  1. Negative X. Shrinks width.
  2. Negative Y. Shrinks height.
  3. Minimum size. Browsers may clamp very small windows.
  4. Need exact size? Use resizeTo.

Example 5 — Log Dimensions

Compare innerWidth × innerHeight before and after.

JavaScript
const before = window.innerWidth + "×" + window.innerHeight;
window.resizeBy(50, 30);
const after = window.innerWidth + "×" + window.innerHeight;
console.log("Before:", before, "After:", after);
Try It Yourself

How It Works

  1. Snapshot first. Read viewport size before the call.
  2. Resize. Apply a small relative change.
  3. Snapshot again. Compare — if equal, the browser blocked it.
  4. Async note. MDN: resize may not be synchronous; resize event can help.

Browser Support

Window.resizeBy() is marked Baseline Widely available on MDN (since July 2015). Browser Window API — not a Node.js built-in. Actual resizing still depends on popup / OS policy.

✓ Baseline · Widely available

resizeBy()

Relative window resizes across modern browsers (with UX restrictions).

99% Core tag support
Chrome Yes
Full support
Edge Yes
Full support
Firefox Yes
Full support*
Safari Yes
Full support
Opera Yes
Full support
HTML element 100% supported

Bottom line: API is universal; prefer resizable script-opened popups. Do not build layout on resizeBy().

Frequently Asked Questions

It changes the current window size by a relative amount. The first argument grows or shrinks width; the second grows or shrinks height. Positive values enlarge; negative values shrink.
resizeBy(dx, dy) adjusts from the current size. resizeTo(width, height) sets an absolute outer size.
No. Browsers often block resizing tabs the user opened directly, or windows with multiple tabs. It works more reliably on popups created with window.open() and the resizable feature.
No. It returns undefined. Read innerWidth / innerHeight, or listen for the resize event, if you need to confirm a change.
Open it with the resizable feature (for example features: "resizable"). Also keep same-origin access to the popup reference.
No. MDN marks Window.resizeBy() as Baseline Widely available (since July 2015). It is not Deprecated, Experimental, or Non-standard — but browser and OS restrictions still apply.

Next: resizeTo()

Set a window’s absolute outer width and height.

resizeTo() →

About the author

Mari Selvan M P
Mari Selvan M P 🔗

Developer, cloud engineer, and technical writer

  • Experience 12 years building web and cloud systems
  • Focus Full Stack Development, AWS, and Developer Education

I write practical tutorials so students and working developers can learn by doing—from databases and APIs to deployment on AWS.

8 people found this page helpful