Forum Home
Press F1
 
Thread ID: 56420 2005-04-04 08:37:00 Different CSS depending on screen resolution JimboJones (1680) Press F1
Post ID Timestamp Content User
341417 2005-04-04 08:37:00 Is it possible? Most likely is, please post code.

Thanks 		JimboJones (1680)
341418 2005-04-04 08:48:00 This is possible with client-side scripting, just a small javascript that detects the screens width and height and then loads the CSS file for it.

However if it's only to load it for formatting reasons, then why not create the CSS script to cater for any resolution, by working out the percentages of width/height to cater for.

Just look for a javascript that can detect the screen size, then you'll just rewrite it so that if it falls within a certain size, to load the suitable CSS stylesheet.

KK 		Kame (312)
341419 2005-04-04 08:49:00 I suppose you could do this using Javascript, something like



if (screen.width == 640) {
document.write('<link rel="stylesheet" href="Homepage640.css">');
}
if (screen.width == 800) {
document.write('<link rel="stylesheet" href="Homepage800.css">');
}
if (screen.width == 1024) {
document.write('<link rel="stylesheet" href="Homepage1024.css">');
}
if (screen.width == 1280) {
document.write('<link rel="stylesheet" href="Homepage1280.css">');
}
if (screen.width == 1600) {
document.write('<link rel="stylesheet" href="Homepage1600.css">');
}
else {
document.write('<link rel="stylesheet" href="Homepage_other.css">');
}


Something I found at the better end of a google. ;) But if you structure your CSS properly and use a good mixture of element sizing in both static and dynamic values, then you shouldnt really need this... 		whetu (237)
1