[hsc]

Following code works in IE but not in Firefox. Its a simple functionality. On mouse over sub menu should be displayed.

function toggle(id)
{
	if (elCurDisplay != null )
	{
		elCurDisplay.style.display = 'none';
	}
	el = document.getElementById(id);
	elCurDisplay = el; 
	var display = el.style.display ? '' : 'none';
	el.style.display = display;
}

<table>
	<span id='sp_main1' onmouseover="toggle('child1_1')"  onmouseout="hide('child1_1')"  >
	<tr>
		<td id="Main1" >
			
			<b>Main One</b>
			
		</td>
	</tr>	
	
	<tr >
		<td id="childmenu_1">
			<span id='child1_1' class='item' style="display:none">
			<table>
				<tr><td>
					Child 1
				</td></tr>
				<tr><td>
					Child 2
				</td></tr>
				<tr><td>
					Child 3
				</td></tr>
			</table>
			</span>
		</td>
	</tr>
	</span>
</table>

** edit **

This post has been edited by no2pencil: 09 April 2008 - 02:23 AM

[chrisman]

Well, the funny thing about FireFox is that it doesn't work with ANY <span>s it flat-out doesn't support them. You could use <div>s here, couldn't you?

[no2pencil]

Rather than nesting spans, why not put one span inside of a div?

[JasonMcAuley]

<div> layers are your friend here.