Hi,
This is my first post. My apology, if it has already been asked. I have the following code:
<html>
<head>
<link href=http://www.webdeveloper.com/forum/archive/index.php/"800.css" rel="stylesheet" type="text/css">
<script type="text/javascript">
function start() {
if(window.screen.width==800)
document.getElementsByTagName('link')[0].setAttribute("href","800.css");
else if(window.screen.width==1024)
document.getElementsByTagName('link')[0].setAttribute("href","1024.css");
else if(window.screen.width==640)
document.getElementsByTagName('link')[0].setAttribute("href","640.css");
else
document.getElementsByTagName('link')[0].setAttribute("href","800.css");
}
</script>
<head>
<body onLoad="start()">
<p> test..</p>
</body>
</html>
I would like to change the css file based on the screen resolution, but the above does not work. What am I not doing here?
Any pointers would be highly appreciated.
DamarWelcome to the forums.
Note that even if this did work correctly, it should not be done. I'll explain why: first and foremost, CSS alone will allow you to create a fluid site in which works under all resolutions. Secondly, if the user in question does not have JavaScript available, the layout won't look as intended to them. I would suggest asking this in the CSS forum (or I could move it for you) if you require further help writing your CSS correctly. As a hint: use units such as % and em so your layout is fluid.Fredmv,
Thanks for your comments. I got your point, and, I gues, I should go that direction for the safe play.
Can you please move my message to CSS forum?
Thanks,
DamarNo problem; at your command.
To start off, a link to the page in question would be helpful so we can help you modify your CSS.
This is my first post. My apology, if it has already been asked. I have the following code:
<html>
<head>
<link href=http://www.webdeveloper.com/forum/archive/index.php/"800.css" rel="stylesheet" type="text/css">
<script type="text/javascript">
function start() {
if(window.screen.width==800)
document.getElementsByTagName('link')[0].setAttribute("href","800.css");
else if(window.screen.width==1024)
document.getElementsByTagName('link')[0].setAttribute("href","1024.css");
else if(window.screen.width==640)
document.getElementsByTagName('link')[0].setAttribute("href","640.css");
else
document.getElementsByTagName('link')[0].setAttribute("href","800.css");
}
</script>
<head>
<body onLoad="start()">
<p> test..</p>
</body>
</html>
I would like to change the css file based on the screen resolution, but the above does not work. What am I not doing here?
Any pointers would be highly appreciated.
DamarWelcome to the forums.
Note that even if this did work correctly, it should not be done. I'll explain why: first and foremost, CSS alone will allow you to create a fluid site in which works under all resolutions. Secondly, if the user in question does not have JavaScript available, the layout won't look as intended to them. I would suggest asking this in the CSS forum (or I could move it for you) if you require further help writing your CSS correctly. As a hint: use units such as % and em so your layout is fluid.Fredmv,
Thanks for your comments. I got your point, and, I gues, I should go that direction for the safe play.
Can you please move my message to CSS forum?
Thanks,
DamarNo problem; at your command.
To start off, a link to the page in question would be helpful so we can help you modify your CSS.