resolution css redirect script

[kobus.dp]

Hi Guys

The script below works perfectly in Mozilla, but not in IE... any
ideas?
It specifies a specific style sheet for 3 types of resolutions.

---------------------------------------------------------------------------

var myWidth = 0;

if( typeof(window.innerWidth) == 'number' ) {
myWidth = window.innerWidth;
}else if(typeof(document.documentElement.clientWidth) == 'number'){
myWidth = document.documentElement.clientWidth;
}else if(typeof(document.body.clientWidth) == 'number'){
myWidth = document.body.clientWidth;
}

if (myWidth <= 1280) {
document.write('<link rel="stylesheet" type="text/css"
href="about_1280.css">');
}
if (myWidth <= 1024) {
document.write('<link rel="stylesheet" type="text/css"
href="about_1024.css">');
}
if (myWidth <= 800) {
document.write('<link rel="stylesheet" type="text/css"
href="about_800.css">');
}

 

[Richard Cornford]

The script below works perfectly in Mozilla, but not in IE... any
ideas?

}else if(typeof(document.documentElement.clientWidth) == 'number'){
myWidth = document.documentElement.clientWidth;
}else if(typeof(document.body.clientWidth) == 'number'){
myWidth = document.body.clientWidth;
}

<snip>

The decision as to which of documentElement.clientWidth and
body.clientWidth holds the actual width of the client-region of the
window depends on the 'mode' (as may be read from - document.compatMode
-) of the document. In 'CSS1Compat' mode the documentElement is the
object to look at, while in 'BackCompat' mode it is the body. From IE5
on both properties are defined and have numeric type (and on IE < 5
attempting to execute - document.documentElement.clientWidth - will
error as no - documentElement - property of the document is available).

If your document is in 'BackCompat' mode on IE your - myWidth - will be
set to zero.

Richard.

 

[Dr John Stockton]

JRS: In article <[email protected]>
, dated Wed, 2 Aug 2006 05:19:13 remote, seen in
news:comp.lang.javascript, (e-mail address removed) posted :

The script below works perfectly in Mozilla, but not in IE... any
ideas?
It specifies a specific style sheet for 3 types of resolutions.

Why does it specify no style sheet for the fourth type?

Your output could more compactly have been written as something like

document.write('<link rel="stylesheet" type="text/css" href="about_' +
( myWidth<=800 ? '800' : myWidth<=1024 ? '1024' :
myWidth<=1280 ? '1280' : '' ) + '.css">');

in which I have retained the bug.