homepage Welcome to WebmasterWorld Guest from 54.242.126.126
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Become a Pro Member
Home / Forums Index / Code, Content, and Presentation / JavaScript and AJAX
Forum Library, Charter, Moderator: open

JavaScript and AJAX Forum

    
Javascript: different pop-up depending on screen resolution
alfonce

10+ Year Member



 
Msg#: 355 posted 11:06 am on Apr 10, 2003 (gmt 0)

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

WebmasterWorld Senior Member 10+ Year Member



 
Msg#: 355 posted 11:20 am on Apr 10, 2003 (gmt 0)

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

10+ Year Member



 
Msg#: 355 posted 11:53 am on Apr 10, 2003 (gmt 0)

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

10+ Year Member



 
Msg#: 355 posted 11:57 am on Apr 10, 2003 (gmt 0)

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

WebmasterWorld Senior Member 10+ Year Member



 
Msg#: 355 posted 12:28 pm on Apr 10, 2003 (gmt 0)

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

WebmasterWorld Senior Member 10+ Year Member



 
Msg#: 355 posted 12:29 pm on Apr 10, 2003 (gmt 0)

Some small corrections might help:

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

alfonce

10+ Year Member



 
Msg#: 355 posted 1:40 pm on Apr 10, 2003 (gmt 0)

This works well,

thank you very very much for this

Alex.

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / Code, Content, and Presentation / JavaScript and AJAX
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved