Add class to body based on current page width

I think it'd be great to add a class to the body element that's based on the current width of the page/screen.
For example, if the page/screen width is 1280px, add 'screen-large' as a class to the body. Or if the width is 800px, add 'screen-small' to the body.

This way, people can theme their pages differently based on the current width of the page/screen.
For example:

body.screen-large #sidebar-left {
  width: 300px;
}

body.screen-small #sidebar-left {
  width: 150px;
}

I got the idea from this article on A List Apart, and modified the code to produce the attached .js file.
It just needs to be loaded to work.

I thought about making this a module, then people could easily specify their own class names and widths from the UI, but I'm not a module developer yet, so thought it might be better as part of the Zen theme for now...
Let me know what you think.