What I have found (as far as my personal website is concerned) is that this won't cut it. I need the classes that the JavaScript creates to be used as conditional modifiers, where once triggered or tripped in the proceeding IF clauses, it will enact a corresponding CSS file for the given monitor resolution.
So in other words, I would like something like the following:
Code: Select all
window.onload = function(){setScreenClass();};window.onresize = setScreenClass;
function setScreenClass(){
var w = document.documentElement.clientWidth;
var h = document.documentElement.clientHeight;
var w_class = (w<=240)?'w_240':(w>240&&w<=320)?'w_320':(w>320&&w<=640)?'w_640':(w>640&&w<=800)?'w_800':(w>800&&w<=1024)?'w_1024':(w>1024&&w<=1152)?'w_1152':(w>1152&&w<=1280)?'w_1280':'w_1600';
var h_class = (h<=600)?'h_600':(h>600 && h<=768)?'h_768':(h>768 && h<=800)?'h_800':(h>800 && h<=1024)?'h_1024':(h>1024 && h<=1280)?'h_1280':'h_1600';
if(w_class = 'w_1024'){
document.getElementById('css').href = 'w_1024.css';
}elseif(w_class = 'w_1152'){
document.getElementById('css').href = 'w_1024.css';
}etc...
};