2 Differently Sized Pop Up Windows on Same Page

webmaniacal · Oct 15, 2006

Hello all.... I need two buttons on a page next to each other so that one initiates a pop up window sized 278x243 to allow visitors to hear audio files and another sized 750x750 that allows visitors to view videos.

I have used the code below to generate the first pop up but I am having difficulty trying to alter the code so that a second pop up differently sized can function. I tried copying the <head> code and changing the name but I get errors. Could someone please helP? thank you!

<HEAD>
<!-- Begin
function popUp(URL) {
day = new Date();
id = day.getTime();
eval("page" + id + " = window.open(URL, '" + id + "', 'toolbar=0,scrollbars=0,location=0,statusbar=0,menubar=0,resizable=0,width=278,height=243');");
}

<BODY>
<input type=button value="Audio" onClick="javascript

opUp('

http://www.mysite.com/Player.htm')"

style="color: #091D80; border: 4px outset #000080; background-color: #FFFFFF">

<input type=button value="Video" onClick="javascript

opUp('

http://www.mysite.com/Video.htm')"

style="color: #091D80; border: 4px outset #000080; background-color: #FFFFFF">

BillyRayPreachersSon · Oct 15, 2006

You are missing a script tag - at present, you are simply pasting JavaScript code into the head, but commented out - so it will never run. You also have no closing head section, and are using eval when you really don't need to. Try this code instead:

Code:

<html>
<head>
	<script type="text/javascript">
		function popUp(url) {
			id = new Date().getTime();
			window['page' + id] = window.open(url, id, 'width=278,height=243');
		}
	</script>
</head>

<body>
	<form>
		<input type="button" value="Audio" onclick="popUp('[URL unfurl="true"]http://www.mysite.com/Player.htm')"[/URL] style="color: #091D80; border: 4px outset #000080; background-color: #FFFFFF">
		<input type="button" value="Video" onclick="popUp('[URL unfurl="true"]http://www.mysite.com/Video.htm')"[/URL] style="color: #091D80; border: 4px outset #000080; background-color: #FFFFFF">
	</form>
</body>
</html>

Note the much-reduced window.open call - if you specify any parameters, then you can omit any that you don't want.

I've also added the form you omitted, and added the quotes around the attibutes you missed off.

Note: If you're never using the global "pageXXXXX" variables, you can also omit the "id=" line, as well as the assignment to the pageXXXXX variable.

Hope this helps,
Dan

Coedit Limited - Delivering standards compliant, accessible web solutions

[tt]Dan's Page [blue]@[/blue] Code Couch

http://www.codecouch.com/dan/

[/tt]

webmaniacal · Oct 15, 2006

thank you for taking the time to re-do the code...i realized the entire head script wasnt there...but here is the thing....i still need to be able to call two different sized popups....the one is 278x243 which you have in the head section but the second is 750x750

??

thanks again

BillyRayPreachersSon · Oct 15, 2006

Oh yes - I forgot that bit ;-)

Change the function declaration to be:

Code:

function popUp(url, width, height)

and then change this:

Code:

'width=278,height=243'

to this:

Code:

'width=' + width + ',height=' + height

Then you can simply pass 2 extra parameters, the width and height through.

Hope this helps,
Dan

Coedit Limited - Delivering standards compliant, accessible web solutions

[tt]Dan's Page [blue]@[/blue] Code Couch

http://www.codecouch.com/dan/

[/tt]

webmaniacal · Oct 16, 2006

ah perfect! thank you very much!

Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

2 Differently Sized Pop Up Windows on Same Page

webmaniacal

Technical User

BillyRayPreachersSon

Programmer

webmaniacal

Technical User

BillyRayPreachersSon

Programmer

webmaniacal

Technical User

Similar threads

Part and Inventory Search

Sponsor