Javascript: different pop-up depending on screen resolution

[alfonce]

Hello and thanks,

Im trying to build a simple javascript function and struggling as this is the first time I have ever tried javascript.

Basically Im trying to get a url into a pop up window dependend on the current users resoultion.

Scenario 1:

If the browser is 800 by 600 or lower than I want url a to be targeted into a pop window of an 800 by 600 size with. The window is to be fixed size and have no scroll bar or nav vbar or any of that.

Scenario 2:

If the res is higher than 800 by 600 ie 1024 then I want url b to be targeted into a similarly formatted pop window the size this time being 1024.

Also the javascript function needs to work at least in ie and netscape.

Here is my code so far

<script language="JavaScript">

function jumper() {
var w = screen.width;
if(w<740){
window.location.href("cat.html");
}
if(w>=740 & w<835){
window.location.href("hat.html");
}
if(w>=835){
window.location.href("mat.html");
}
}
</script>

And this goes on a button or link

onClick="jumper()"

This code does actually partly work in that it gets the correct url dependent on res. However, I still need to get the url as a formatted _blank pop window and for some reason this doesnt work at all In Netscape browsers so its possible it doesnt work in other browsers either.

Any help would be greatly appreciated.

thanks

Alex.

[le_gber]

I think you should use a popup window code, try this:

<script language="JavaScript">

function jumper() {
var w = screen.width;
if(w<740){
window.open('cat','cat.html','width=650,height=500
toolbar=yes,location=yes,status=yes,menubar=yes,scrollbars=yes,resizable=yes,');
}
if(w>=740 & w<835){
window.open('hat','hat.html','width=650,height=500
toolbar=yes,location=yes,status=yes,menubar=yes,scrollbars=yes,resizable=yes,');
}
if(w>=835){
window.open('mat','mat.html','width=650,height=500
toolbar=yes,location=yes,status=yes,menubar=yes,scrollbars=yes,resizable=yes,');
}
}
</script>

it should do the trick

leo

ps. BTW Welcome to WebmasterWorld

<added> if you don't want them to be able to see the URL or resize the window, just play with the yes. Also work if you put 1 and 0 (1=yes;0=no).</added>

[edited by: tedster at 8:04 pm (utc) on April 10, 2003]
[edit reason] remove side scroll [/edit]

[alfonce]

Hey thanks a lot,

this is cool. When I use onLoad="jumper()" in the body tag it works a treat.

However Im getting errors when running it on a button like this onClick="jumper()"

Is there something wrong with the way I try and envoke the script on my button

thanks a lot

Alex.

[alfonce]

Hmm,
actually not I try it again in ie it errors on the page with the body tag onLoad also and yet it works dine in netscape 7.

So what I got is the onClick function erroring in both netscape and ie but the onload working only in netscape.

However Im only interested in getting the onClick working as the function will be called by clicking on a graphic or on a hot spot rectange.

Any ideas how

thanks again

Alex.

[le_gber]

sorry my mistake:
<note: line breaks added to features string- tedster>

function jumper()
{
var w = screen.width;
if (w<740)
{
window.open('cat.html','cat','width=650,height=500,
toolbar=yes,location=yes,status=yes,menubar=yes,scrollbars=yes,resizable=yes');
}
else if (w>=740 && w<835)
{
window.open('hat.html','hat','width=650,height=500,
toolbar=yes,location=yes,status=yes,menubar=yes,scrollbars=yes,resizable=yes');
}
else
{
window.open('mat.html','mat','width=650,height=500,
toolbar=yes,location=yes,status=yes,menubar=yes,scrollbars=yes,resizable=yes');
}
}

I accidently inverted the URL and the window name (and forgot commas as well).

This one work (I tried it) :)))

Leo

[edited by: tedster at 8:07 pm (utc) on April 10, 2003]
[edit reason] remove side scroll [/edit]

[RonPK]

Some small corrections might help:

(cut remarks, le_gber beat me at it ;-)

[alfonce]

This works well,

thank you very very much for this

Alex.