jQuery resize: Main Tips
- The jQuery
.resize()
method either attaches an event handler that executes a function when aresize
event occurs, or triggers the event. - This
.resize()
function is a shorthand for the .on() method withresize
as the event parameter.
Handling resize Events
The jQuery .resize()
method attaches an event handler, executing a function when a resize
event occurs. It can trigger the event as well. This event occurs everytime a jQuery window resize happens:
Example
var times = 0;
$(window).resize(() => {
$("p").text("The window has been resized " + (times += 1) + " times.");
});
Use this syntax to trigger the jQuery resize event:
$("selector").resize();
Or this syntax to attach an event handler jQuery on window resize:
$("selector").resize(function);
In the first case, no arguments are needed (only the selector). However, to attach a handler, you need to specify a function
to be executed when jQuery on window resize event occurs.
Note: depending on the browser, jQuery window resize events can be sent continuously during the resizing process, or only once after the resize is finished.