...

View Full Version : Help needed with JavaScript Dropdown menu



GundamV3
07-12-2003, 03:34 AM
Ok, i just installed a JavaScript Dropdown menu into my site to replace my older navigation system on my site. I like to use frames for my site, but when i click a link on the menu, it pops up in a new page. How do i make the page open in the frame? Here is the site: www.gundamv3.com and here is the java script and the frame:



<select name="menu" onChange="location=document.jump.menu.options[document.jump.menu.selectedIndex].value;" value="GO">
<option value="http://www.gundamv3.com/main.html">Home</option>
<option value="http://www.gundamv3.com/about.html">About</option>
<option value="http://www.gundamv3.com/support.html">Support</option>
<option value="http://www.gundamv3.com/Series.html">Series</option>
<option value="http://www.gundamv3.com/MM.html">Multimedia</option>
<option value="http://www.gundamv3.com/models.html">Models</option>
<option value="http://www.gundamv3.com/merc.html">Merchindise</option>
<option value="http://www.gundamv3.com/links.html">Links</option>
<option value="http://www.gundamv3.com/MISC.html">MISC</option>
<option value="http://gundamv3.signmyguestbook.com">Guestbook</option>
</select>
</form>


and here is the frame:



<iframe name="main" width="795" height="629" src="main.html">
Your browser does not support inline frames or is currently configured not to display inline frames.</iframe></tr>
<tr>

MotherNatrsSon
07-12-2003, 04:35 AM
I am using a Mac and Netscape 7. I have attached a screenshot. 1024 x 768 resolution. You have to reference your frame in yout link.

MNS

GundamV3
07-12-2003, 04:43 PM
but where and what exaclly should the code be?

MotherNatrsSon
07-12-2003, 05:35 PM
try adding target="main" to your links.

<option value="http://www.gundamv3.com/about.html" target="main">About</option>

It may need an undescore in there too. Try it and see what works. target="_main"

MNS

GundamV3
07-12-2003, 06:18 PM
for some reason it works with this optiton:
<option value="http://www.gundamv3.com/main.html">Home</option>
but none of the others

Skyzyx
07-12-2003, 07:44 PM
I haven't tested it, but after looking at your 1.2.0 site, I think this should work. Let me know if it doesn't.

Add this to your HEAD (or use an external .js file... whichever you prefer)


function changePage(changeTo)
{
if (document.getElementById) document.getElementById('main').src=changeTo.options[changeTo.selectedIndex].value; // For W3C DOM
else if (document.all) document.all.main.src=changeTo.options[changeTo.selectedIndex].value; // For older IE4 DOM
}


When you want to call the function from the SELECT box, do this:


<select name="menu" onchange="changePage(this);" value="GO">


It should work. If worse comes to worse, you can edit it to use the full form reference instead of the shorter "this.options[]" reference.

GundamV3
07-12-2003, 08:28 PM
doesnt work, but thats probally from my craptacular JavaScript Skills. Here is the HTML of the javascript after i tried to edit it (now due to i am lost, could you please explain it to someone that only know HTML not javascipt ^_^i)



<select name="menu" onchange="changePage(this);" value="GO" src="menu.js">
<option value="http://www.gundamv3.com/main.html">Home</option>
<option value="http://www.gundamv3.com/about.html">About</option>
<option value="http://www.gundamv3.com/support.html">Support</option>
<option value="http://www.gundamv3.com/Series.html">Series</option>
<option value="http://www.gundamv3.com/MM.html">Multimedia</option>
<option value="http://www.gundamv3.com/models.html">Models</option>
<option value="http://www.gundamv3.com/merc.html">Merchindise</option>
<option value="http://www.gundamv3.com/links.html">Links</option>
<option value="http://www.gundamv3.com/MISC.html">MISC</option>
<option value="http://gundamv3.signmyguestbook.com">Guestbook</option>
</select>
</form>


and before can be seen above

scroots
07-12-2003, 10:08 PM
onChange="location=document.jump.menu.options[document.jump.menu.selectedIndex].value;" value="GO">

should be something like document.iframname.location=....

scroots

ReadMe.txt
07-13-2003, 03:10 PM
<select name="menu" onChange="document.frames['menu'].location=document.jump.menu.options[document.jump.menu.selectedIndex].value;" value="GO">
<option value="http://www.gundamv3.com/main.html">Home</option>
<option value="http://www.gundamv3.com/about.html">About</option>
<option value="http://www.gundamv3.com/support.html">Support</option>
<option value="http://www.gundamv3.com/Series.html">Series</option>
<option value="http://www.gundamv3.com/MM.html">Multimedia</option>
<option value="http://www.gundamv3.com/models.html">Models</option>
<option value="http://www.gundamv3.com/merc.html">Merchindise</option>
<option value="http://www.gundamv3.com/links.html">Links</option>
<option value="http://www.gundamv3.com/MISC.html">MISC</option>
<option value="http://gundamv3.signmyguestbook.com">Guestbook</option>
</select>
</form>


try that for the select box.

GundamV3
07-13-2003, 09:26 PM
thanks readme.txt your idea worked ^_^ just had to replace teh ['menu'] part with ['main'] (main is the frames name)



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum