PDA

Click to See Complete Forum and Search --> : Java menu stuff

Bobby Peru
02-12-2003, 07:50 AM
I have two questions concerning the "Combined menu script" that I found on this site... hope you guys can help me!

Can I create a third menu that also affects the link which is generated?

example: if I have a menu in which you select a "car brand", and another in which you select "year produced"; I could end up with a link to Toyota1993.htm
But I want another factor; for example: "Color". So a link could end up with Toyota1993red.htm

Hope that made sense!

My other question concerns spicing up the menu's themselves... Can I change the look from the boring gray/white standard? Cause' I can't figure out how without ruining the above-mentioned script!

here's the script, btw, if that makes it easier on you guys:
(Thanks in advance!)

<HEAD>

<SCRIPT LANGUAGE="JavaScript">
<!-- Original: Ronnie T. Moore, Editor -->
<!-- Idea by: Selvi Narayanan -->

<!-- This script and many more are available free online at -->
<!-- The JavaScript Source!! http://javascript.internet.com -->

<!-- Begin
site = "http://www.yoursite.com"; // Do not include the final "/"
function combineMenus(frm, menu1, menu2) {
with (frm) {
str = menu1.options[menu1.selectedIndex].value;
str += menu2.options[menu2.selectedIndex].value;
url = site + "/" + str + ".html";
window.location.href = url;
}
}
// End -->
</script>
</HEAD>

<!-- STEP TWO: Copy this code into the BODY of your HTML document -->

<BODY>

<center>
<form name=menufrm>
<select name=menu1>
<option value="">Make</option>
<option value="Ford">Ford</option>
<option value="Chevy">Chevy</option>
<option value="Toyota">Toyota</option>
</select>

<select name=menu2>
<option value="">Year</option>
<option value="1998">1998</option>
<option value="1999">1999</option>
<option value="2000">2000</option>
</select>

<input type=button value="Select" onClick="combineMenus(this.form, this.form.menu1, this.form.menu2)">
</form>
</center>

<p><center>
<font face="arial, helvetica" size="-2">Free JavaScripts provided<br>
by <a href="http://javascriptsource.com">The JavaScript Source</a></font>
</center><p>
pyro
02-12-2003, 08:16 AM
Here's what needed to be changed:

<HEAD>

<SCRIPT LANGUAGE="JavaScript">
<!-- Original: Ronnie T. Moore, Editor -->
<!-- Idea by: Selvi Narayanan -->

<!-- This script and many more are available free online at -->
<!-- The JavaScript Source!! http://javascript.internet.com -->

<!-- Begin
site = "http://www.yoursite.com"; // Do not include the final "/"
function combineMenus(frm, menu1, menu2, menu3) {
with (frm) {
str = menu1.options[menu1.selectedIndex].value;
str += menu2.options[menu2.selectedIndex].value;
str += menu3.options[menu3.selectedIndex].value;
url = site + "/" + str + ".html";
window.location.href = url;
}
}
// End -->
</script>
</HEAD>

<!-- STEP TWO: Copy this code into the BODY of your HTML document -->

<BODY>

<center>
<form name=menufrm>
<select name=menu1>
<option value="">Make</option>
<option value="Ford">Ford</option>
<option value="Chevy">Chevy</option>
<option value="Toyota">Toyota</option>
</select>

<select name=menu2>
<option value="">Year</option>
<option value="1998">1998</option>
<option value="1999">1999</option>
<option value="2000">2000</option>
</select>

<select name=menu3>
<option value="">Color</option>
<option value="red">Red</option>
<option value="blue">Blue</option>
<option value="white">White</option>
</select>

<input type=button value="Select" onClick="combineMenus(this.form, this.form.menu1, this.form.menu2, this.form.menu3)">
</form>
</center>

<p><center>
<font face="arial, helvetica" size="-2">Free JavaScripts provided<br>
by <a href="http://javascriptsource.com">The JavaScript Source</a></font>
</center><p>
Bobby Peru
02-12-2003, 08:56 AM
Thanks Pyro, you came through once again!

the navigation works now... could you add your 2 cents on my layout issue?

I was thinking I might be able to combine it with one of the scripts on the site (there's a nice black roll-down menu somewhere, I think)

Just need to know if it can be done though
pyro
02-12-2003, 10:13 AM
Ah, didn't even see part two of your question. Anyway, here you go. Just change colors, etc to fit your needs.

<form name=menufrm>
<select name=menu1 STYLE="COLOR: #ffffff; BORDER: #333333 1px solid; BACKGROUND-COLOR: black">
<option value="">Make</option>
<option value="Ford">Ford</option>
<option value="Chevy">Chevy</option>
<option value="Toyota">Toyota</option>
</select>

<select name=menu2 STYLE="COLOR: #ffffff; BORDER: #333333 1px solid; BACKGROUND-COLOR: black">
<option value="">Year</option>
<option value="1998">1998</option>
<option value="1999">1999</option>
<option value="2000">2000</option>
</select>

<select name=menu3 STYLE="COLOR: #ffffff; BORDER: #333333 1px solid; BACKGROUND-COLOR: black">
<option value="">Color</option>
<option value="red">Red</option>
<option value="blue">Blue</option>
<option value="white">White</option>
</select>

<input type=button value="Select" STYLE="COLOR: #ffffff; BORDER: #999999 1px solid; background-color:black" onMouseover="this.style.backgroundColor='#666666';" onMouseout="this.style.backgroundColor='black';" onClick="combineMenus(this.form, this.form.menu1, this.form.menu2, this.form.menu3);">

</form>
Bobby Peru
02-12-2003, 10:18 AM
I was thinking something along the lines of that.

thanks for your help, p!