Internet Explorer OnResize | September 2nd, 2005
I recently came across a very strange behaviour in Internet Explorer - shock, horror!
It is related to the OnResize event. In Internet Explorer the onresize event will fire on any node for which the event is defined. Take, for example, the following HTML snippit:
If you have this in a web page and resize the window, in Internet Explorer 6 you will first see the alert from the body and then it will start at the deepest part of the hierarchy (ie the div child node) and fire all resize events until it reache the top of the node tree at which point it will again fire the event on the body tag! There are also situations where if you resize an element through JavaScript this will cause the body resize event to fire - but only once rather than twice as it does when you manually resize the window.
When run in Firefox, Opera or Netscape my sample code only fires the body onresize event once and does not fire the onresize events on elements contained in the body element.
So be careful when building AJaX components that take advantage of the onresize event.
January 15th, 2008 at 5:24 am
I came here searching about that after hitting the same problem.
IE simply sucks
January 14th, 2009 at 2:25 pm
Several years later, this problem still haunts people.
You can prevent it from running twice (in IE) by stopping event propagation: http://www.quirksmode.org/js/events_order.html
Anyway, I came here to post that it seems like onresize won’t work in IE unless the page is fully loaded. Thought that could help people.