Need javascript help with Jump Menu

djg · #1 (**permalink**) 01-21-2005, 05:11 PM

Hi all,
I have a Jump Menu, when you click on an item it opens a new HTML document -- my question is what do I have to put in the code to specify the size of the window I want to open (I'm not a programmer, so I rely on the handy dandy "Behaviours" features in Dreamweaver that writes the code for me!

Here is the code for my jump menu: - (I want the windows that open to be 400 px wide x 300 px high)

Thanks SO MUCH!

<select name="select" onChange="MM_jumpMenu('parent',this,1)">
<option value="#" selected>Select Style</option>
<option value="ver_cvl_maestro.htm">Maestro</option>
<option value="ver_cvl_ovation.htm">Ovation</option>
<option value="ver_cvl_frost.htm">Frost</option>
<option value="ver_cvl_fine.htm">Fine Cannelure</option>
<option value="ver_cvl_perf18.htm">Perforated P-18/32</option>
<option value="ver_cvl_perf21.htm">Perforated P-21</option>
<option value="ver_cvl_perfp24.htm">Perforated P-24</option>
<option value="ver_cvl_perfp27.htm">Perforated Designer P-27</option>
</select>

mikmik · #2 (**permalink**) 01-22-2005, 11:59 PM

I think for starters, parent is a bad target.

Anyhooo, try this, and if it doesn't work, let me know. I am not great at this stuff yet :O)))
<select name="select" onChange="NewWindow(this.href,'name','400','350',' yes','center');return false" onfocus="this.blur()">

Here is a nice dropdown menu with a description, but it has a 'GO' button:
http://dynamicdrive.com/dynamicindex1/combodescribe.htm

djg · #3 (**permalink**) 01-24-2005, 09:50 AM

Thanks MikMik,

I replaced
"<select name="select" onChange="MM_jumpMenu('parent',this,1)">

With your code:
<select name="select" onChange="NewWindow(this.href,'name','400','350',' yes','center');return false" onfocus="this.blur()">

And it doesn't seem to work -- perhaps I've replaced it incorrectly, or I'm missing something?

You can check out the web page I put the menu in at:
http://www.royalwindowcoverings.com/...ct/ver_cvl.htm

Thanks again for your time :)

djg · #4 (**permalink**) 01-26-2005, 01:02 PM

Hi...still trying to figure out how to designate a specific size for the new window to open. Anybody else have a suggestion?

Thanks much!

paulhiles · #5 (**permalink**) 01-26-2005, 04:48 PM

The following might just work! (the Javascript itself originally comes from the Accessify site).
Add the following JavaScript to the <head> section of your web page.

<script type="text/javascript">
var newWindow = null;

function closeWin(){
if (newWindow != null){
if(!newWindow.closed)
newWindow.close();
}
}

function popUpWin(url, type, strWidth, strHeight){

closeWin();

if (type == "fullScreen"){

strWidth = screen.availWidth - 10;
strHeight = screen.availHeight - 160;
}

var tools="";
if (type == "standard" || type == "fullScreen") tools = "resizable,toolbar=yes,location=yes,scrollbars=yes ,menubar=yes,width="+strWidth+",height="+strHeight +",top=0,left=0";
if (type == "console") tools = "resizable,toolbar=no,location=no,scrollbars=no,wi dth="+strWidth+",height="+strHeight+",left=0,top=0 ";
newWindow = window.open(url, 'newWin', tools);
newWindow.focus();
}
</script>

Add the following to the body of your page:

<form name="jump-menu" method="post" action="#">
<select name="select" onchange="popUpWin(this.href = this.options[this.selectedIndex].value,'standard',640,480);return false;">
<option value="">Please select...</option>
<option value="http://www.google.com">Google</option>
<option value="http://www.msn.com">MSN</option>
</select>
</form>

What you're doing here is using the onchange event handler to call the JavaScript "popUpWin" function.
The 640,480 values are setting the width and height respectively for the new window.
Obviously you can adapt these to suit! :o)
I've only tried it in Firefox and IE so far.. and so far, so good! :o)

Paul

djg · #6 (**permalink**) 01-26-2005, 05:09 PM

Thanks Paul.

I tried it, and I don't know what I'm doing wrong, but when I click on the items in the menu, nothing happens?

You can check it out at: http://www.royalwindowcoverings.com/...thdropdown.htm

Thanks again for your help!

paulhiles · #7 (**permalink**) 01-26-2005, 05:28 PM

You've got two lines like this... one after the other.
<script language="JavaScript" type="text/JavaScript">

Try removing one.. and see if that does the trick! :o)

Paul

djg · #8 (**permalink**) 01-26-2005, 05:40 PM

:-( that did not work either, still won't work. Sorry, don't know what I'm doing wrong (that's what happens when a non-programmer tries to mess with java scripts!)

Thanks,

paulhiles · #9 (**permalink**) 01-26-2005, 05:50 PM

Try copying this into the top of your page's code before the <body> tag.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>contract louvers - Royal Window Coverings</title>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="JavaScript" src="../fade.js"></script>
<script language="JavaScript" src="openWin.js"></script>
<link href="styles.css" rel="stylesheet" type="text/css">
<script language="JavaScript" type="text/JavaScript">

</script>

<script language="JavaScript" type="text/JavaScript">

</script>

<style type="text/css">

</style>

<script language="JavaScript" type="text/JavaScript">

</script>
<link href="../styles.css" rel="stylesheet" type="text/css">
<link href="../styles.css" rel="stylesheet" type="text/css">
<style type="text/css">

</style>
</head>

djg · #10 (**permalink**) 01-27-2005, 09:33 AM

That did it! Thanks so much Paul, I really appreciate your time :) (I have many uses for this type of jump menu, so it is very valuable to me)

Cheers,