Open In App
Related Articles

Cross-browser window resize event using JavaScript/jQuery

Improve Article
Save Article
Like Article

The resize() method is an inbuilt method in jQuery that is used when the browser window changes its size. The resize() method triggers the resize event or attaches a function to run when a resize event occurs. jQuery has a built-in method for window resizing events. 



This syntax is used for cross-browser resize events. 

Example 1: This example uses resize() method to count how many times browsers window resize. 


    var x = 1;
    $(document).ready(function() {
        $(window).resize(function() {
            $("span").text(x += 1);
<p>Window resized <span>0</span> times.</p>
<p>Try resizing your browser window.</p>



You can use the addEventListener() method to register an event handler to listen for the browser window resize event, such as window.addEventListener(‘resize’, …). 


object.addEventListner("resize", myscript);

Example 2: This example display the size of resize windows. 


<div id="result"></div>
    // Defining event listener function
    function displayWindowSize() {
        // Get width and height of the window
        // excluding scrollbars
        var w = document.documentElement.clientWidth;
        var h = document.documentElement.clientHeight;
        // Display result inside a div element
            = "Width: " + w + ", " + "Height: " + h;
    // Attaching the event listener function
    // to window's resize event
    window.addEventListener("resize", displayWindowSize);
    // Calling the function for the first time
    <strong>Note:</strong> Please resize the browser
    window to see how it works.



Whether you're preparing for your first job interview or aiming to upskill in this ever-evolving tech landscape, GeeksforGeeks Courses are your key to success. We provide top-quality content at affordable prices, all geared towards accelerating your growth in a time-bound manner. Join the millions we've already empowered, and we're here to do the same for you. Don't miss out - check it out now!

Last Updated : 23 Jan, 2023
Like Article
Save Article
Similar Reads
Complete Tutorials