PDA

View Full Version : Javascript - Redirection script error

chrisparton1991
11-27-2006, 04:35 AM
Hi there pplz.

Can someone tell me why this script doesn't work? (the whole page is there as you can see :))

The script is meant to redirect the user to the appropriate site according to resolution, and - if the resolution isn't supported - redirect them to the best-fitting site.

For some reason, once i added the code to redirect you to the nearest site, the script stopped working :(.


<html>
<head>
<title>Welcome to Corrimal High School! Detecting Monitor Resolution...</title>
<link rel = "StyleSheet" href = "table.css" type = "text/css">
</head>

<body bgcolor = "#e5e5e5">

<table align = "center" width = "90%" cellpadding = 0 cellspacing = 0>
<td align = "center"><b>Please wait, detecting monitor resolution and redirecting as neccessary...</b></br></br>
<b>If a yellow bar like the one below:</br></br>
<img src = "activex.png" border = "1"></br></br>
<b>shows up, click on it, then click on "allow blocked content...". Then click yes.</b></br>
</td></tr>
</table>

<script language = "JavaScript">
<!--
//Script made by Chris Parton, feel free to use it in any way you wish!

var scrWidth=screen.width;
var scrheight=screen.height;


if ((screen.width==1024) && (screen.height==768))
{
document.write('<META HTTP-EQUIV="refresh" content="4;URL=1024x768/index.html"> ')
}

else if ((screen.width==1280) && (screen.height==960))
{
document.write('<META HTTP-EQUIV="refresh" content="4;URL=1280x960/index.html"> ')
}

else if ((screen.width==1600) && (screen.height==1200))
{
document.write('<META HTTP-EQUIV="refresh" content="4;URL=1600x1200/index.html"> ')
}

//////////////////////////////////Start of sketchy script
else if ((scrWidth >= 1024) && (scrWidth < 1280)) || ((scrHeight >= 768) && (scrHeight < 960))
{
document.write('<center></br><hr></br><b>We could not determine your resolution, you will be redirected to the page that best fits your screen. If you do not understand this, please disregard this message.</b><META HTTP-EQUIV="refresh" content="8;URL=1024x768/index.html"> ')
}

else if ((scrWidth >= 1280) && (scrWidth < 1600)) || ((scrHeight >= 960) && (scrHeight < 1200))
{
document.write('<center></br><hr></br><b>We could not determine your resolution, you will be redirected to the page that best fits your screen. If you do not understand this, please disregard this message.</b><META HTTP-EQUIV="refresh" content="8;URL=1280x960/index.html"> ')
}

else if ((scrWidth >= 1600)) || ((scrHeight >= 1200))
{
document.write('<center></br><hr></br><b>We could not determine your resolution, you will be redirected to the page that best fits your screen. If you do not understand this, please disregard this message.</b><META HTTP-EQUIV="refresh" content="8;URL=1600x1200/index.html"> ')
}
//////////////////////////////////End of sketchy script

//-->
</script>


</body>

</body>
</html>


If i get rid of the 'sketchy script', it works fine(my monitor is supported), but when i add it in, the whole thing screws up.

as you may be able to see, im only new to JavaScript, so I'm hoping it's a boneheaded mistake like a missing operator :).

Thanks heaps,
Chris
coothead
11-27-2006, 08:05 AM
Hi there chrisparton1991,

as the use of document.write and tables are discouraged I have modified your page slightly...
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Welcome to Corrimal High School! Detecting Monitor Resolution...</title>
<link rel="StyleSheet" href="table.css" type="text/css">

<style type="text/css">
body {
background-color:#e5e5e5;
}
#message1 {
width:90%;
margin:auto;
text-align:center;
font-weight:bold;
}
#message1 img {
width:100px;
height:22px;
border:1px solid #000;
display:block;
margin:10px auto;
}
.hide {
display:none;
}
#message2 {
width:90%;
font-weight:bold;
text-align:center;
margin:auto;
}
</style>

<script type="text/javascript">

var url;

window.onload=function(){
scrW=screen.width;
scrH=screen.height;
obj=document.getElementById('message2');

if((scrW==1024)&&(scrH==768)) {
url='1024x768/index.html';
}
else if((scrW==1280)&&(scrH==960)) {
url='1280x960/index.html';
}
else if((scrW==1600)&&(scrH==1200)) {
url='1600x1200/index.html';
}
else if((scrW>=1024)&&(scrW<1280)||(scrH>=768)&&(scrH<960)) {
obj.className='';
url='1024x768/index.html';
}
else if((scrW>=1280)&& (scrW<1600)||(scrH >=960)&&(scrH<1200)) {
obj.className='';
url='1280x960/index.html';
}
else if((scrW>=1600)||(scrH>=1200)) {
obj.className='';
url='1600x1200/index.html';
}
setTimeout('redirect()',4000);
}

function redirect() {
location.href=url;
}

</script>

</head>
<body>

<div id="message1">
<p>
Please wait, detecting monitor resolution and redirecting as neccessary...
</p><p>
If a yellow bar like the one below:
<img src="activex.png" alt="activex">
</p><p>
shows up, click on it, then click on "allow blocked content...". Then click yes.
</p>
</div>

<div id="message2" class="hide">
<hr />
<p>
We could not determine your resolution, you will be redirected to the page that best fits your screen.
</p><p>
If you do not understand this, please disregard this message.
</p>
</div>

</body>
</html>
chrisparton1991
11-28-2006, 07:44 AM
I couldn't get that to work :(

is there any way of just fixing the errors in my script?