Problem with jump-menu in IE

**Jeanco** · Mar 23, 2007 09:21

Hello,

I have created a small javascript jump menu that is designed to hide/display content depending on the users selection. It works perfectly in firefox, but nothing happens in IE.

Can anyone help?

Here is the relevant code:
The content being changed

Code:

<div id="listing" style="padding:0; margin:0; overflow:auto; border:0; width:100&#37;; height:100%;"> 
<span id="E" style="display:inherit;"><?php require("currentListing/E.html"); ?></span>
<span id="I" style="display:none;"><?php require("currentListing/I.html"); ?></span>
<div >

The jump menu:

Code:

<form name="jumpMenu">
<select name="menu" style="background-color: #FFFFFF; font-size: 9px; font-family: verdana; color:#000000; padding: 0; margin: 0;" size="1" onchange="jump(this.form, this.form.menu.options[this.form.menu.selectedIndex].value)">		
<option value="0" selected="selected">Select Announcements</option>
<option value="0">--------------------</option>
<option value="E">External Announcements</option>
<option value="I">Internal Announcements</option>	
</select>
</form>

The javascript:

Code:

<script language="javascript">
function jump(form) {
	var myindex=form.menu.selectedIndex
	//if we're choosing to see external announcements
	if (form.menu.options[myindex].value == "E") {
		//then show the external <span>
		document.getElementById("E").style.display = 'inherit';
		document.getElementById("I").style.display = 'none';
	//if we want the internal
	} else if (form.menu.options[myindex].value == "I") {
		//then show the external <span>
		document.getElementById("I").style.display = 'inherit';
		document.getElementById("E").style.display = 'none';
	} else {
	}
}
//-->
</script>

Any help is very much appreciated.

Thanks.