Skip to content Skip to sidebar Skip to footer

Detect When Div Width Is Change Using Javascript

I am new in javascript and I want to perform some action when the div with is changed in jquery, I use this code var width = $(window).width(); $(window).resize(function(){ if(

Solution 1:

You can use on-resize-event like this:

var body = document.getElementsByTagName("BODY")[0];
    var width = body.offsetWidth;
    
    if (window.addEventListener) {  // all browsers except IE before version 9window.addEventListener ("resize", onResizeEvent, true);
    } else {
      if (window.attachEvent) {   // IE before version 9window.attachEvent("onresize", onResizeEvent);
      }
    }
    
    functiononResizeEvent() {
      bodyElement = document.getElementsByTagName("BODY")[0];
      newWidth = bodyElement.offsetWidth;
      if(newWidth != width){
        width = newWidth;
        console.log(width);
      }
    }

Solution 2:

Subscribe to the onresize event

window.onresize = functionName

Solution 3:

In Internet Explorer you can use "onresize", to trigger a JavaScript function whenever size of an element(div) or body is changed.

But "onresize" does not work the same way in other browsers. Mozilla Firefox will trigger the function only when body is resized not a div.

<bodyonresize="myFunction()">

will work in every browser

<divonresize="myFunction()">

Will work only in IE

Post a Comment for "Detect When Div Width Is Change Using Javascript"