Generally resize means to make something different size. In graphical user interfaces, we can size windows to make them larger or smaller. According to JQuery langauge, the resize event occurs when the size of the browser window changes. It binds event handler to resize event or binds a function which is to be executed when resize event occurs. It is used to perform some desired actions such as adjusting page elements depending on the window size in order to avoid scroll bars etc. If the dimensions of the element changes, then inside elements also should adjust as well when the resize event triggers. It is useful when creating application like layouts.
JQuery Resize() Syntax
It has parameter called function which specifies the function to be run when resize event occurs.
JQuery Resize() Example
- $(window).resize(function()) line defines resize event which occurs when the size of the browser window changes. When you click on the maximize button on the top corner, you would see the alert message with new window width and height.
- When window is resized, it displays width and height of the window by using alert box.
JQuery Resize() Example Demo
When you run the above example, you would get the following output :