adaptive html layout via css body class
window.onload = setScreenClass; // may break $(document).ready()?
window.onresize = setScreenClass;
// credit: http://www.alistapart.com/articles/switchymclayout
// example: http://paulwreid.com/about/
// Following transition classes will be declared:
//
// classname screenwidth
// ------------------------------------------
// pda_ver 240px
// pda_hor 320px
// screen_ultralow 320px - 640px
// screen_low 640px - 800px
// screen_med 800px - 1024px
// screen_high 1024px - 1280px
// screen_wide > 1280px
function setScreenClass(){
var fmt = document.documentElement.clientWidth;
var cls = (fmt<=240)?'pda_ver':(fmt<=320)?'pda_hor':(fmt<=640)?'screen_ultralow':(fmt<=800)?'screen_low':(fmt<=1024)?'screen_med':(fmt<=1280)?'screen_high':'screen_wide';
//document.getElementById('count').innerHTML=fmt+'px -> '+cls;//for UI display
document.body.className=cls;
};