onresize Event

Definition and Usage

The onresize event occurs when the browser window is resized.

Tip:To get the size of an element, use clientWidth, clientHeight,innerWidth,innerHeight,outerWidth,outerHeightand offsetWidth and/or offsetHeight properties.

Example

Example 1

Execute JavaScript when the browser window size is adjusted:

<body onresize="myFunction()">

Try It Yourself

Example 2

Use the addEventListener() method to attach the "resize" event to the window object:

window.addEventListener("resize", myFunction);

Try It Yourself

Syntax

In HTML:

<element onresize="myScript">

Try It Yourself

In JavaScript:

object.onresize = function(){myScript};

Try It Yourself

In JavaScript, use the addEventListener() method:

object.addEventListener("resize", myScript);

Try It Yourself

Note:Internet Explorer 8 or earlier versions do not support addEventListener() Method.

Technical Details

Bubble: Not supported
Cancelable: Not supported
Event Type: If generated from the user interface,UiEvent. Otherwise Event.
Supported HTML Tags: <body>
DOM Version: Level 2 Events

Browser Support

Events Chrome IE Firefox Safari Opera
onresize Support Support Support Support Support