How can I detect if the window really resized in IE8 standards mode?

Question

My site has many style sheets customized for varying screen widths. As the browser is resized, the window.onresize event checks that a resize actually took place by looking at document.documentElement.clientWidth. If it did, it turns on successively larger style sheets until scrollbars appear. Then, it turns them off in reverse order until scrollbars disappear. Scrollbars are detected by comparing offsetWidth to scrollWidth.

In IE8, two new problems confound detection of a resize. One, onresize fires whenever scrollbars appear or disappear, and two, d.dE.clientWidth reports the width without scrollbars, a break from IE7 and all other browsers. My site now frequently gets trapped in a loop in which the onresize logic activates a larger style sheet, which creates scrollbars, which then triggers another resize event that cannot be filtered out because the clientWidth has changed due to scrollbars appearing or disappearing. This would be a trivial fix if IE8 had something like outerWidth I could check.

Answer 1

You're almost certainly aware of this - and it doesn't really answer your questions as it's forcing IE8 out of Standards Mode - but the quick fix would be to force IE8 into IE7 mode using an HTTP header.

Answer 2

Since I had never dealt with scrollbar generation triggering onresize in any browser, I did not realize that checking d.dE.clientWidth was not a good verification, and in fact never did include the scrollbars. I now check d.dE.offsetWidth instead, and the repeated onresize events are filtered out.