PDA

Click to See Complete Forum and Search --> : Drop Down Menus In Frames

fernboneyard
07-28-2003, 02:02 PM
You folks solved "drop down menus" for non frames web pages under the thread "DROP DOWN MENUS." Unfortunately, it doesn't work COMPLETELY within frames.

My "gigundus" web page (with over 100 html files) uses both frames and non frames html pages and I want to use drop down menus in each. I ginned up a simple frames web page with a top menu row at the top. The bottom row is divided into a narrow left submenu column and a wider column for viewing pages in the submenu.

The problem is that when I click on any of the drop down menu items, it opens in the top (menu) row of the frame page only. The bottom row stays the same. Is there a fix for this?

Basic Files Follow

frameMaster.html

<HTML>
<HEAD>
<TITLE>Frame Master</TITLE>
</HEAD>
<FRAMESET ROWS="180, *">
<FRAME SRC="frameTop.html">

<FRAMESET COLS="300,*">
<FRAME SRC="frameSideLeft.html">
<FRAME SRC="http://www.yahoo.com" NAME="WINDOW-1">
</FRAMESET>

</FRAMESET>
</HTML>

frameTop.html

<HTML>
<HEAD>
<TITLE>Frame Top</TITLE>
<SCRIPT LANGUAGE="JavaScript">

<!-- Begin
function formHandler1(){
var URL = document.form.site.options[document.form.site.selectedIndex].value;
window.location.href = URL;
}
function formHandler2(){
var URL = document.form.site.options[document.form1.site.selectedIndex].value;
window.location.href = URL;
}

// End -->
</SCRIPT>

</HEAD>

<BODY BGCOLOR="#FFCC99" TEXT="#000000" LINK="#0000FF" VLINK="#800080" ALINK="#FF0000">

<TABLE ALIGN="center" BGCOLOR="#F5F5DC" BORDER="1" CELLSPACING="2" CELLPADDING="2" WIDTH="100%">
<TR>
<TD WIDTH="20%" ROWSPAN="2"><A HREF="http://www.yahoo.com" TARGET="_top">Yahoo</A></TD>
<TD WIDTH="20%" ROWSPAN="2"><A HREF="http://www.metacrawler.com" TARGET="_top">Metacrawler</A></TD>
<TD WIDTH="20%" ROWSPAN="2"><A HREF="http://www.altavista.digital.com"
TARGET="_top">Altavista</A></TD>
<TD WIDTH="20%" ALIGN="center">Drop Down 1</TD>
<TD WIDTH="20%" ALIGN="center">Drop Down 2</TD>
</TR>

<TR>

<TD WIDTH="20%">

<form name="form">
<select name="site" size=1 onChange="javascript:formHandler1()">
<option value="">Go to....
<option value="http://www.yahoo.com">Yahoo
<option value="http://www.metacrawler.com">Metacrawler
<option value="http://www.altavista.digital.com">Altavista
<option value="http://www.webcrawler.com">Webcrawler
<option value="http://www.lycos.com">Lycos
<option value="http://javascript.internet.com">JavaScript Source
</select>
</form>

</TD>

<TD WIDTH="20%">

<form name="form1">

<select name="site" size=1 onChange="javascript:formHandler2()">
<option value="">Go to....
<option value="http://www.yahoo.com">Yahoo
<option value="http://www.metacrawler.com">Metacrawler
<option value="http://www.altavista.digital.com">Altavista
<option value="http://www.webcrawler.com">Webcrawler
<option value="http://www.lycos.com">Lycos
<option value="http://javascript.internet.com">JavaScript Source
</select>

</form>

</TD>

</TR>
</TABLE>

<H1><CENTER>Frame Top</CENTER></H1>

</BODY>
</HTML>

frameSideLeft.html

<HTML>
<HEAD>
<TITLE>FrameSideLeft</TITLE>

</HEAD>

<BODY BGCOLOR="#FFCC99" TEXT="#000000" LINK="#0000FF" VLINK="#800080" ALINK="#FF0000">

<TABLE ALIGN="left" BGCOLOR="#F5F5DC" BORDER="1" CELLSPACING="2" CELLPADDING="2" WIDTH="100%">

<TR>
<TD ALIGN="center" VALIGN="middle">
<A HREF="http://www.yahoo.com"
TARGET="WINDOW-1">Yahoo</A></TD>
</TR>

<TR>
<TD ALIGN="center" VALIGN="middle">
<A HREF="http://www.metacrawler.com"
TARGET="WINDOW-1">Metacrawler</A></TD>
</TR>


<TR>
<TD ALIGN="center" VALIGN="middle">
<A HREF="http://javascript.internet.com"
TARGET="WINDOW-1">Javascript Source</A></TD>
</TR>

</TABLE>
</BODY>
</HTML>

(Sorry about the length of this message)
requestcode
07-28-2003, 02:10 PM
You need to reference the frame that you want to load the document into like this:
parent.frame_name.location.href=URL

"frame_name" is the name you gave the frame you want to load the document into. In your case WINDOW-1. You might not want to use the "-" dash in the name as it might cause problems with JavaScript.
Nevermore
07-28-2003, 02:10 PM
Where it says window.location.href = URL;, change window to the name of the frame for the page to appear in.
fernboneyard
07-28-2003, 06:08 PM
Thank you requestcode and cijori but I don't want to open the drop down addresses into a frame. I want to go to the drop down url page while the current total page (every frame of it) closes.

If you copy the three files in my first posting to the same directory and giving them the names I gave them there are some interesting things that happen.

Open up the frameMaster.html file.

1. Try to open one of the pull downs in the upper menu row.
The new URL opens up in the upper frame only. The lower frames stay on the screen.

2. Click on the "Javascript Source" in the left menu column.
The Javascript Source page opens up in the "full" screen. Everything else in the left menu column opens up in the right column frame - like theyre supposed to.

Any ideas why this is so. Can I use a similar method with my drop down menu to open up to the full screen.