Table and text

My question is quite simple, but hard to explain. So because a Web page says more than a thousand words.. please go to my site:  http://www.internations.net/nl/wimkerk/index.html
wimkerkAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

xabiCommented:
I supose you want a dropdown menu where you can select where you want to go. If so here goes the code, if not please explain better what you want:

--------- 8< ------ 8< --------
<HTML>
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
<!--
function go() {
  idform = document.myform
  location.href = idform.where.options[idform.where.selectedIndex].value
  return false
}
//-->            
</SCRIPT>
</HEAD>
<BODY>
<form name="myform">
  <select name="where">
    <option value="http://www.google.com">Option 1</option>
    <option value="http://www.yahoo.com">Option 2</option>
  </select><br>
  <input type="Button" value="Go!" onclick="go()">
</form>
</BODY>
</HTML>
--------- 8< ------ 8< --------

xabi
0
chewymonCommented:
Here is a slightly different script without the Go button.  It opens the selection in a new window.

<SCRIPT language="JavaScript">
<!--

function load(formName) {
  var list = document[formName].list;
  var str = list.options[list.selectedIndex].value;
  if (str != "") open(str, "newwin");
}

// -->
</SCRIPT>


<FORM name="myform">
 
    <SELECT name="list"onChange="load('myform')">
      <OPTION value="http://www.yahoo.com">YaHoo
<OPTION value="gear.htm">Gear
      <OPTION value="http://www.webcrawler.com">WebCrawler
    </SELECT>
</FORM>



BTW, xabi - I like your script also and will most likely use it at some point.
0
xabiCommented:
Thank you chewymon. I put a go button cause his web design has a go menu, so it should be easiest to port the script to his site.

Thank you anyway.

xabi@i.am
0
The Ultimate Tool Kit for Technolgy Solution Provi

Broken down into practical pointers and step-by-step instructions, the IT Service Excellence Tool Kit delivers expert advice for technology solution providers. Get your free copy for valuable how-to assets including sample agreements, checklists, flowcharts, and more!

egbservicesCommented:
Here are my thousand words... please go to our site:
http://www.enermet.co.nz/
if it is what you want... just copy the source code!
Edi
0
wimkerkAuthor Commented:
Thank you all for responding, but I am afraid I didn't make myself clear. My problem is not how to create the JavaScript code for my dropdown menu. I just can not get the text "Name of Category" "Home/" and the drop down box in the center of the purple table.
See on this page (of Experts Exchange) for instance "Comment" and "Accept comment as answer". Both are in the middle of the grey table. In my table the "Name of Category" is in the center and "Home/" and the dropdown box are positioned higher.
Sorry for the confusion.
0
chewymonCommented:
This works.  The row heights need some tweaking, but the idea ia to put the text and form in one row that is just the right height to hold them, then add a row above and below that is colored to acheive the effect you want.


<HTML>
<HEAD>
<TITLE></TITLE>
<META http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</HEAD>

<BODY bgcolor="#ffffff">
<!-- START HOME FREE HEADER CODE --> <!-- END HOME FREE HEADER CODE -->
<CENTER>
  <TABLE width=95% border="0" cellpadding="0" cellspacing="0">
    <TR>
      <TD width=4% valign=top rowspan=4><IMG src=logo.gif></TD>
      <TD width=1% valign=top rowspan=4> </TD>
      <TD colspan=3 height="6"> </TD>
    </TR>
    <TR>
      <TD width=39% align=left bgcolor=purple height="47" valign="middle"> </TD>
      <TD width=38% align=left bgcolor=purple height="47" valign="middle"> </TD>
      <TD width=18% align=right bgcolor=purple valign="baseline" height="47"> </TD>
    </TR>
    <TR>
      <TD width=39% align=left bgcolor=purple height="27" valign="baseline"><FONT color=white face=Arial,Helvetica size=3><B>Name
        of category</B></FONT></TD>
      <TD width=38% align=left bgcolor=purple height="27" valign="baseline">
        <DIV align="right"><FONT color=white face=Arial,Helvetica size=3><A href="link.html"><FONT color=white face=Arial,Helvetica size=3><B>Home</B></FONT></A>
          <FONT color=white face=Arial,Helvetica size=3><B>/</B></FONT></FONT></DIV>
      </TD>
      <TD width=18% align=right bgcolor=purple valign="baseline" height="27">
        <SELECT name="select">
          <OPTION value="link1.html">Option 1
          <OPTION value="link2.html">Option 2
        </SELECT>
        <INPUT type=submit value=Go! name="submit">
      </TD>
    </TR>
    <TR>
      <TD width=39% align=left bgcolor=purple height="23" valign="middle"><FONT color=white face=Arial,Helvetica size=3> </FONT></TD>
      <TD width=38% align=left bgcolor=purple height="23" valign="middle">
        <DIV align="right"><FONT color=white face=Arial,Helvetica size=3></FONT></DIV>
      </TD>
      <TD width=18% align=right bgcolor=purple valign="baseline" height="23">
        <FORM action="get">
          <DIV align="right">   </DIV>
        </FORM>
      </TD>
    </TR>
  </TABLE>
  <!-- START HOME FREE FOOTER CODE --> <!-- END HOME FREE FOOTER CODE -->
  <P> </P>
  <P> </P>
</CENTER>
</BODY>
</HTML>
0
wimkerkAuthor Commented:
Hi chewymon. I am afraid it doesn't work. In NN4 there is no drop down box and the logo is much higher than the purple part of the table.

In IE4 the purple table is four rows high.

I have uploaded it (the code has two header and footer code comments now, but I will delete those) :  

http://www.internations.net/nl/wimkerk/1.html
0
chewymonCommented:
No it didn't.  I goofed.  Try this.  The best I have been able to achieve is to get the text aligned with the top of the options box.  If you played with the text size in the box, you could probably get it closer, but this is a real pain in Netscape.

<HTML>
<HEAD>
<TITLE></TITLE>
<META http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</HEAD>

<BODY bgcolor="#ffffff">
  <TABLE width=95% border="0" cellpadding="0" cellspacing="0">
    <TR>
      <TD width=5% valign=top rowspan=4><IMG src=logo.gif></TD>
      <TD width=1% valign=top rowspan=4>&nbsp;</TD>
      <TD colspan=3 height="6">&nbsp;</TD>
    </TR>
       <TR>
      <TD width=39% align=left bgcolor=purple height="47" valign="middle">&nbsp;</TD>
      <TD width=41% align=left bgcolor=purple height="47" valign="middle">&nbsp;</TD>
      <TD width=14% align=right bgcolor=purple valign="baseline" height="47">&nbsp;</TD>
    </TR>

    <TR>
     
    <TD width=39% align=left bgcolor=purple height="27" valign="top"><FONT color=white face=Arial,Helvetica size=4>&nbsp;<B>Name
      of category</B></FONT></TD>
     
    <TD width=41% align=right bgcolor=purple height="27" valign="top"> <A href="link.html"><FONT color=white face=Arial,Helvetica size=4><B>Home</B>
      <B>/</B></FONT></A>
    <TD width=14% align=left bgcolor=purple height="27">
      <FORM action="get">
         <SELECT name="select">
            <OPTION value="link1.html">Option 1
            <OPTION value="link2.html">Option 2
          </SELECT>
         </FORM>
      </TD>
    </TR>
 <TR>
     
    <TD width=39% align=left bgcolor=purple height="40" valign="middle">&nbsp;</TD>
     
    <TD width=41% align=left bgcolor=purple height="40" valign="middle">&nbsp;</TD>
     
    <TD width=14% align=right bgcolor=purple valign="baseline" height="40">&nbsp;</TD>
    </TR>

  </TABLE>
 
  <P>&nbsp;</P>
  <P>&nbsp;</P>

</BODY>
</HTML>
0
wimkerkAuthor Commented:
I looked a bit on the Web and Excite has something similar to what I am looking for:
http://shopping.excite.com/autos/

However, I am not able to determine exactly what they have done. I will increase the points to 210 if you can help me with this.
0
chewymonCommented:
Here is the code for their table.  Maybe you can just plug your values in, then put the whole think in a table cell to retain the look.


<table cellspacing=0 cellpadding=4 border=0 width=96% bgcolor="#333399">
<tr><td><form action="/redir.dcg" method=get onChange="submit()">
<select name=url size=1 onchange= "submit()">
<option value=/>Shopping Home
<option value=/autos/ selected>Autos
<option value=/baby_gear/ >Baby Gear
<option value=/beauty/ >Beauty
<option value=/books/ >Books
<option value=/clothes_and_accessories/ >Clothes &amp; Accessories
<option value=/computers/ >Computers
<option value=/electronics/ >Electronics
<option value=/flowers_and_cards/ >Flowers &amp; Cards
<option value=/garden/ >Garden
<option value=/gourmet_and_groceries/ >Gourmet &amp; Groceries
<option value=/health/ >Health
<option value=/house_and_home/ >House & Home
<option value=/music/ >Music
<option value=/office/ >Office
<option value=/software/ >Software
<option value=/sports_and_fitness/ >Sports &amp; Fitness
<option value=/toys_and_games/ >Toys &amp; Games
<option value=/videos/ >Videos
<option value=/everything_else/ >Everything Else
</select>
<input type=submit value=Go!></FORM></td>
<td align=right><form action=/search/><font color=#FFFFCC face=arial,helvetica size=><b>Product Search:</b></font>&nbsp;<input name=kw size=18 value="">&nbsp;
<input type=hidden name=num value="1">
<input type=hidden name=pic value="">
<input type=submit value=Search></FORM></td>
</tr></table>
0
wimkerkAuthor Commented:
Ok, thanks chewymon. Collect your points please.
0
chewymonCommented:
Cross browser authoring is a gas, isn't it?
0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
wimkerkAuthor Commented:
Yes it is. I am having a lot of fun :)
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
HTML

From novice to tech pro — start learning today.