de acuerdo a la resolucion tendrías que usar
window.screen.widht
y
window.screen.height
Actualmente yo para ajustar mi sitio a diversas resoluciones, utilizo este código:
Código Javascript
:
Ver original<script type="text/javascript">
function reso(){
var winW = 630, winH = 460;
if (document.body && document.body.offsetWidth) {
winW = document.body.offsetWidth;
winH = document.body.offsetHeight;
}
if (document.compatMode=='CSS1Compat' &&
document.documentElement &&
document.documentElement.offsetWidth ) {
winW = document.documentElement.offsetWidth;
winH = document.documentElement.offsetHeight;
}
if (window.innerWidth && window.innerHeight) {
winW = window.innerWidth;
winH = window.innerHeight;
}
if (winW>1281)
{
document.getElementById('resolucion').href="centrado.css";
}
if (winW<1280 && winW>1025)
{
document.getElementById('resolucion').href="ajustado2.css";
}
if (winW>1025)
{
document.getElementById('resolucion').href="ajustado.css";
}
}
</script>
<link rel="stylesheet" type="text/css" title="resolucion" id="resolucion" />
</head>
<body onload="reso()" bgcolor="#ddd" style="text-align:center;">
Que sería que segun la resolucion active diferentes .css
pero lo que hace es tomar el tamaño de la ventana (si está en 1024x768, 1280x800, 1360x760) a diferencia de lo otro que se guía por la resolución configurada en el sistema operativo.