Help with option value code in IE browser

[Vampiregirl]

Hi, I am new here and would appreciate anyone who could help me out with the below coding for my site. (I have been figuring it out for hours, but to no avail! )

Its confusing due to the modifications I had made to the codes, but I will try to describe my problem in the best way that I can.

Firstly, I had inserted a drop down list menu in the site, and I want the user to be able to read the information on the same page by clicking on the specified option in the menu. I do not have any specific a href links to direct the <option value""> part. I need to know if its possible to use "div id" as the target instead?

Supposedly, the code from my site for the menu is like this:

<form>
<select onChange="location=this.options[this.selectedIndex].value;" style="font-family:'Chaparral Pro';color:#FFCCFF;background-color:#bd0a0a; font-weight:bold; font-size:13pt;">
<option value="#"> Main Menu </option>
<option value="????"> Chapter 1 </option>
<br></form>

This is the original code before I added any changes. The "???" above indicate the current problem I am facing now.

As I am a noob to HTML, I am not sure on how to go about the coding in the <option value=""> part. I know that a link from the page can be inserted in which will lead the user to it once clicked. But however, I do not have any specific urls to insert in it. I have a text area in the site, and I only want the information in it to display within the text area once clicked. In other words, the main url remains unchanged.

After my "random modifications" to the code yesterday while using Firefox, I managed to get it working. (As you can see below, I replaced an "#onClick#" in the <option value> instead of the usual linkages, and added a "getElementbyId" at the back to get the information to show up once the option is being clicked from the dropdown menu. I had a div id. To my surprise, it actually works... but only in Firefox, and not IE.)

<option value="#onClick#" span style="cursor: nw-resize" onClick="document.getElementById

('welcome').innerHTML=document.getElementById('chapter1').innerHTML"
style="cursor: ew_resize" onMouseOut="this.style.textDecoration= 'none';">Chapter 1</option>

With this code in IE browser, everything will look fine at first glance. The menu can be scrolled. However, it doesn't react when I click on the options. The page remains intact, and simply display no information at all. It seems that the "#onClick# command can only work in Firefox.

I need it to work in IE too, but may I ask how do I go about with the <option value> thingy? Am I able to use a <div id> code to lead it to display the information needed within the text area?

I do hope the way I described it isn't causing any confusion! Thank you in advance!

[effpeetee]

See if this is any help.

Linking to another document or to another place in the same document:

To create a hyperlink to jump elsewhere, one must identify the hypertext and the hyperlink in the following manner:

<A HREF="file#destination">[text to click on]</A>

The [text to click on] IS THE HYPERTEXT and will be underlined when the document is read by Mosaic. The file#destination is the place Mosaic will jump to (see below) when the hypertext is clicked upon.
The following statement must be placed at the spot where one wants Mosaic to jump to:

<A NAME="Destination">[text to jump to]</A>

Note that this position was given a name Destination which was referenced in the hyperlink above. The [text to jump to] can be omitted.
When using filenames, it is always better and faster to use relative references than absolute references. For example, if the reference is to a document in the same directory, simply the filename must be specified.

If the link is to the beginning of another document, than the Destination need not be specified, and the link is simply:

<A HREF="file">[text to click on]</A>

If the link is to another part of the same document, then the filename need not be specified, but the Destination must me specified. The link becomes:
<A HREF="#destination">[text to click on]</A>

With the destination statement as:
<A NAME="Destination">[text to jump to]</A>

Hope I haven't mis-understood you.


Frank

[Vampiregirl]

Hi,
thanks for your prompt response. I tried inserting the codes, but seems like it doesn't work with my menu bar. =(
I had set up a test site using blogger for easy reference. Hope it will be clearer this way, too.

It is located at: www.ilovetomyam.blogspot.com

As you can see, there is my pulldown menu at the left side. As I am using IE now, it seems to have no response when clicked.
But when I use Firefox, the content will show up in my text area fine.
(Both browser will show that my main url actually becomes www.ilovetomyam.blogspot.com/#onclick#. The #onclick# was modified using firefox.) I tried inserting a href codes beside the <option value>, but it got all messed up in IE. As blogger is the main platform I am using in building the site, I can't seem to create a Destination nor any external linkages. The only way I could think of is through the creation of div ids to jump the page.

Apologies for taking up much of your time in helping a noob like me. >< Thanks once again!!

[effpeetee]

There are many markup errors and you do not have a Doctype.

See here.

Also many CSS errors.

See here.

They need to be addressed before anything else.

Frank

[hivelocitydd]

As far as I know onClick event in the <option> will work only with firefox and will not work in IE. So you have to us the onChange event as you have done in the <select>.

But instead of that try some thing like

<select onChange="yourjsfunction( this.options[this.selectedIndex].value )">
<option value="somevalue">value</option>
---
</select>

and create a js function

<script type="text/javascript" language="javascript">

function yourjsfunction(val) {
document.getElementById('welcome').innerHTML=document.getElementById(val).innerHTML";

}
</script>

Hope this helps