I have to make a site that displays a few different items depending on the resolution of the client. I am having trouble with the scripting. I want to check the resolution and display the correct items accordingly. I set up two classes in my style sheet and I want to change the class. heres the script as it is.

HTML Code:
function change(id, newClass) {

identity=document.getElementById(id);

identity.className=newClass;

}


if ((screen.width>=1280) && (screen.height>=960))
{
function reschange(){
change('header','highres');	
change('logo','highres');
change('title','highres');
change('headerbase','highres');
change('left','highres');
change('clearheader','highres');
change('main','highres');
}

}
else
{
function reschange(){
change('header','lowres');	
change('logo','lowres');
change('title','lowres');
change('headerbase','lowres');
change('left','lowres');
change('clearheader','lowres');
change('main','lowres');
}
}

window.onload=reschange();
The high resolution works fine, but when I switch it over to a lower one, there is no change.