...

View Full Version : opening more than one new window



Homer
08-08-2002, 04:33 PM
I am using the following code to open a new window from a text link

<script>

function openpopup(){
var popurl="bookpasses.htm"
winpops=window.open(popurl,"","width=450,height=400,scrollbars,resizable,")
}

</script>

the link is <a href="javascript:openpopup()">car passes</a>


Everything works fine but how can I get it to open different windows with different url's from different text links on the same page, such as

<a href="javascript:openpopup()">car passes</a>
<a href="javascript:openpopup()">bus passes</a>
<a href="javascript:openpopup()">train passes</a>

Any help would be appreciated

Regards

Homer

mhere
08-08-2002, 04:45 PM
hi,,

try this

<script>

function openpopup(popurl){
winpops=window.open(popurl,"","width=450,height=400,scrollbars,resizable,")
}

<a href="javascript:openpopup('car.html')">car passes</a>
<a href="javascript:openpopup('bus.html')">bus passes</a>
<a href="javascript:openpopup('train.html')">train passes</a>

for every link, pass a different parameter,,

is that what u wanted?

aakif.

bobquin
08-09-2002, 12:55 AM
Hi all....I'm trying to do the same thing the original poster is attempting. Your fix definitely worked....thanks for the answer! One more question, though...how can I get each of the pop-ups to open in an entirely new window, rather than each loading into the same window?

kansel
08-09-2002, 01:46 AM
you'll have to pass a window name along with the file to the script like so

function openpopup(popurl,popwin){
winpops=window.open(popurl,popwin,"width=450,height=400,scrollbars,resizable,")
}

<a href="javascript:openpopup('car.html','car')">car passes</a>
<a href="javascript:openpopup('bus.html','bus')">bus passes</a>
<a href="javascript:openpopup('train.html','train')">train passes</a>

openpopup() now expects two string arguments: popurl and popwin - the name of the new window.

There is a point where the amount of control you wish to have over your popup windows will make using an external function like openpopup() more costly than calling window.open from the anchor tag as in the example below.

<a href="train.html" onclick="window.open('','train','width=450,height=400,resizable,scrollbars')" target="train">train passes</a>

This link has complete control over the popup window including name, size and options.

bobquin
08-09-2002, 02:06 AM
excellent....thank you for your help!

bobquin
08-09-2002, 02:37 AM
Sorry, guys...thought I had this figured out, but I don't. Please excuse my JS ignorance!

Basically, I'm generating pop-ups from various image maps on the page. I would like, however, for each popup to open in its own window, rather than having the content for each .htm file showing up in the same window...

Okay, here's my HEAD code:

<script language="JavaScript"><!--
function win(fileName) {
myWin = window.open('','myWindow','scrollbars=yes,directories=no,status=no,resizable=no,toolbar=no,copyhisto ry=no,location=no,menubar=no,width=600,height=400,scrollbars=yes,top=100,left=150')
myWin.location.href = fileName;
}
//--></script>

And here's an example of my BODY code:

<area shape="rect" coords="32,129,126,152" href="javascript:win('about.htm')">
<area shape="rect" coords="32,249,126,272" href="javascript:win('contact.htm')">

What tags/variables do I need to add here to get about.htm and contact.htm each pop up in its own window?

Thanks in advance!

adios
08-09-2002, 04:14 AM
This might help:


<html>
<head>
<title>untitled</title>
<script type="text/javascript" language="javascript">

function popcoll(url, name) {
var width = 500; //pop widths
var height = 300; //pop heights
var offset = 50; //pop spacing
var popfactor, i, temparray = new Array();
if (typeof popcoll.coll == 'undefined') popcoll.coll = new Array();
popcoll.infront = null;
for (i=0; i<popcoll.coll.length; ++i)
if (popcoll.coll[i] && !popcoll.coll[i].closed) {
temparray[temparray.length] = popcoll.coll[i];
if (name == popcoll.coll[i].name) popcoll.infront = popcoll.coll[i];
}
popcoll.coll = temparray;
if (!popcoll.infront)
popcoll.coll[popcoll.coll.length] =
open(url,name,
'width='+width+',height='+height
+',scrollbars,resizable');
for (i=0; i<popcoll.coll.length; ++i) {
popfactor = offset * (i + 1);
popcoll.coll[i].moveTo(popfactor,popfactor);
}
for (i=popcoll.coll.length-1; i>=0; --i) setTimeout('popcoll.coll['+i+'].focus()',i * 50);
if (popcoll.infront) setTimeout('popcoll.infront.focus()',popcoll.coll.length * 50);
return false;
}

</script>
</head>
<body>

<a href="pop1.htm" target="_blank"
onclick="return popcoll(this.href,'pop0')">pop 1</a><br>
<a href="pop2.htm" target="_blank"
onclick="return popcoll(this.href,'pop1')">pop 2</a><br>
<a href="pop3.htm" target="_blank"
onclick="return popcoll(this.href,'pop2')">pop 3</a>

</body>
</html>


You could call it with:

href="javascript&#58;void popcoll('url','pop0')">

..from a map. Pass a unique name for each new window. Not sure it's completely debugged yet, though..

kansel
08-09-2002, 03:52 PM
bobquin

the necessary changes to your script are in bold (i hope)


<script language="JavaScript">
<!--
function win(fileName,winName) {
myWin = window.open('', winName ,'scrollbars=yes,directories=no,status=no,resizable=no,toolbar=no,copyhistory=no,location=no,menubar =no,width=600,height=400,scrollbars=yes,top=100,left=150');
myWin.location.href = fileName;
}
//-->
</script>

<area shape="rect" coords="32,129,126,152" href="javascript:win('about.htm','about')">
<area shape="rect" coords="32,249,126,272" href="javascript:win('contact.htm','contact')">

bobquin
08-09-2002, 06:00 PM
Brilliant! That's exactly what I needed. Now, one additional question. What tags do I need to include in order to get each new window to be slightly offset in location? With all of the windows opening one on top of another, it's easy to miss the fact that there are several open!

Thanks again!

kansel
08-09-2002, 06:36 PM
I would just remove the top and left commands in the function.

change this

function win(fileName,winName) {
myWin = window.open('',winName,'scrollbars=yes,directories=no,status=no,resizable=no,toolbar=no,copyhistory= no,location=no,menubar=no,width=600,height=400,scrollbars=yes,top=100,left=150');
myWin.location.href = fileName;
}

to this (much shorter)



function win(fileName,winName){
myWin = window.open(fileName, winName,'scrollbars,width=600,height=400');
}


the other things I removed because they are unnecessary. saying 'statusbar=no' is the same as leaving statsubar=no out of the function. (no is default when an option is omitted, yes is default if option is included)

bobquin
08-09-2002, 06:44 PM
Excellent advice....done. Thanks so much!

kansel
08-10-2002, 12:17 AM
To paraphrase my first post to this thread - eventually the higher level of control over each individual popup window will obviate the use of a custom function. It will be just as easy to call window.open() from the onclick event of the link.

The upside of using the onclick method is that browsers with little or no javascript support will still be able to open the link since the URL is stored as the href.

<a href="about.htm" onclick="window.open('','about','width=640,height=480,resizable,scrollbars')" target="about">

<a href="contact.htm" onclick="window.open('','contact','width=480,height=360,scrollbars')" target="contact">

These two change the popup window minutely but more code would have to be added to the win() function to support different window sizes and options.

Incidentally this method works perfectly with <area> tags as well as <a> tags. Just be sure to include both the onclick handler and the target attribute (which must be set to the name of the window in the window.open() command).



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum