Drop-down-box and how to hyperlink

  powerless 23:09 29 Jun 2004


Ain't got a clue about this, i'm wanting to create a drop down box so that when you first see it, it has "Continue to..." within the box.

When you click on it you can then select, part 1, part 2 etc and these will be hyperlinked to another page.

I've looked at the help files but can't make sense of it.

That make sense?

  Charence 23:29 29 Jun 2004

I have provided an example below, using "part 1" and "part 2" as links. The ----Please Select----- is the default value. SELECT NAME is the name of the drop down menu and I javascript is used to go to the link. An error message also displays if nothing is selected.



<SELECT NAME="DropDown" SIZE="1">

<OPTION SELECTED VALUE="">-------- Please Select --------

<OPTION VALUE="part1.html">Part 1

<OPTION VALUE="part2.html">Part 2


<INPUT TYPE="button" VALUE="Go"

onClick="if (form.DropDown.selectedIndex != 0)

location = form.DropDown.options[form.DropDown.selectedIndex].value;


alert('Select something from Drop Down Menu Please')">



For every link you want to insert, just add another <OPTION VALUE...>.


  Charence 23:30 29 Jun 2004

it should say "BETWEEN <BODY> TAGS" in the above title

  powerless 01:32 30 Jun 2004

Can i remove the GO button so when an option is selected it opens whatever page is selected?

  Taran 08:30 30 Jun 2004

The easiest way to do this is if you're struggling with code is to use one of the available code generators.

click here

It will produce a JavaScript snippet that should go between the <head></head> tags while the drop down menu itself may go where you like on the page inside the <body></body> tags.

You can do it all within FrontPage but it requires a little jiggerypokery while the above code generator only needs a little input from you to produce what is necessary.

  Charence 14:10 30 Jun 2004




<SELECT NAME="DropDown" SIZE="1"


if (form.DropDown.selectedIndex !=0)

location = form.DropDown.options[form.DropDown.selectedIndex].value;


alert('Select Something!')">

<OPTION SELECTED VALUE="">-------- Please Select --------

<OPTION VALUE="part1.html">Part 1

<OPTION VALUE="part2.html">Part 2






  powerless 10:05 01 Jul 2004

I tried Charence method and tarans click here.

Now they both worked.

But why the extra [or lack of] code in between <head> for the script as just copying and pasting Charence code where i wanted the box did exactly the samething?

  Taran 13:18 01 Jul 2004

There are loads of ways to achieve a similar result. I only included the link to the code generator to save explaning how to do it all from scratch (lazy of me I know).

NetObjects, Dreamweaver, FrontPage and other web editors can all do it for you to an extent, and they all produce different code in the process.

Like many things in the web world there are lots of ways to get to where you want to be and while some may be preferable than others for one reason or another, as long as the end result works reliably, go with it.

The oversimplified answer is that the code generator uses the code block in the head tags to perform a broadly similar function while the snippet offered by Charence has a self contained If-Else command.

The thing I like about that particluar code generator is that it takes frames and old browser versions into account, so the code is degradable to most users and the majority of site configurations. If you read through the header code snippet you should be able to more or less see this in action where target=top, blank, self and parent are all present. Obviosuly if you don't need those functions then you don't have to use them. It's a script that takes most scenarios into account.

  powerless 06:52 03 Jul 2004

When i link to another page in another folder. Do i have to enter the full path to this page?

Or a quicker way?

  Taran 12:53 03 Jul 2004

All links need to target the destination file with its full address within the web root.

If you have a folder in the web root called commerce with a page called inventory.html inside it the path in the hyperlink must read commerce/inventory.html

Any other file or folder name combination won't work and this is one area where people often make mistakes.

Here are four totally different hyperlink targets:





The capital letter and extension (.htm or .html) lead to completely different files as far as the web browser is concerned, which is one of many good reasons why it is important to keep all file names lower case, don't use spaces between filename words, use underscores instead, like_this, and make sure your hyperlinks lead to the correct file.

  Charence 00:38 04 Jul 2004

If the page you are linking to is within the same folder, then all you need is the filename and extension. e.g. "page2.html"

But if it is not in the same folder your link will have to include the folder name as well e.g. "folder/page2.html"

If it is on a completely different server, you will need to include the full URL. e.g. "click here"

Whenever possible, try to avoid using the full URL because if you move your website to another location, you may need to correct all of the links to the new URL of the new server which may be a time consuming process, if your links don't have the full URL, you can easily transfer your site to another server without changing the links.


This thread is now locked and can not be replied to.

Elsewhere on IDG sites

iMac Pro review

3D illustrator Billelis on how to promote yourself on social media

iMac Pro review

Apple Music : comment obtenir 3 mois gratuits ?