I have the following simple html + javascript code fragment in my webpage:
Code: Select all
<link rel="stylesheet" id="MyTag" type = "text/css" media = "screen" />
<!--The following script detects the user agent's browser and resolution and fixes screen issues. -->
<script language = "javascript">
function LoadStyle() {
var browser = navigator.appName;
if(screen.width > 1280 && screen.height > 1024 && browser = "Microsoft Internet Explorer"){
MyTag.href = "large_ie.css";
}
else{
MyTag.href = "default.css";
}
}
</script>
</head>
<body onload="LoadStyle()">
<div class = "allcontent">
<div class= "header">
Code: Select all
.allcontent {
background: url(images/gone_clubbing-1280x1024.jpg) bottom;
width: 1280px;
height: 1024px;
[b]margin: 0px auto;[/b]
}
The problem is that the javascript code I embedded does not work correctly, because when I reload my page, it tends to find no stylesheet, and thus display quite uglily. I've debugged it with alert()s and it seems that in both my computers the code reaches the "else" clause, which is very logical, since I am currently posting from a Debian Linux system with Iceweasel, Konqueror, Opera and no Explorer, and my other computer is a desktop with Windows 7 and Internet Explorer 8, but with a resolution of 1280 by 1024, which is marginably handled by the "else" clause as well.
Is there anything strikingly wrong with the javascript code I've included? I have no knowledge of the language whatsoever (yet) so I just googled my way to a method that would help me detect the client's screen resolution and browser.
Thank you for your time and interest.