View Full Version : Tab menu malfunction

09-29-2004, 11:37 AM
I'm using a tab menu code (http://dynamicdrive.com/dynamicindex1/ddtabmenu.htm), and at first it worked fine. All of a sudden, it doesn't show the mouseover effects on first launch. It has to be reloaded at least once to work. What could be the problem?
It might be useful to know that this code appears within another div; could that be the confusion? I'm not very familiar with layers and divs and such.

<a onMouseover="showit(0)"><IMG SRC="1-horse.gif" ALT="The New Orleans legacy" border="0"></a>&nbsp;&nbsp;
<a onMouseover="showit(1)"><IMG SRC="2-band.gif" ALT="Our unique community" border="0"></a>&nbsp;&nbsp;
<a onMouseover="showit(2)"><IMG SRC="3-sky.gif" ALT="How we fit your business needs" border="0"></a>&nbsp;&nbsp;
<a onMouseover="showit(3)"><IMG SRC="4-balco.gif" ALT="A little something extra" border="0"></a>
<ilayer width=550 height=30 name="dep1" bgColor="cccccc">
<layer name="dep2" width=550 height=30>
<div id="describe" style="background-color:cccccc;width:550px;height:30px" onMouseover="clear_delayhide()" onMouseout="resetit(event)"></div>

<script language="JavaScript1.2">
Tabs Menu (mouseover)- By Dynamic Drive
For full source code and more DHTML scripts, visit http://www.dynamicdrive.com
This credit MUST stay intact for use
var submenu=new Array()

submenu[0]='<b><a href="">A quick tour of our rich history...</a></b>'
submenu[1]='<b><a href="">The People</a> | <a href="">A Regional Profile</a> | <a href="">How We Compare</a></b>'
submenu[2]='<b><a href="">Reasons to Relocate</a> | <a href="">Local Incentives</a> | <a href="">Start-up Contacts</a> | <a href="">Regional Real Estate</a></b>'
submenu[3]='<b><a href="">Whats Happening</a> | <a href="">Other <i>New Orleans Works</i> Portals</a> | <a href="">Search</a> | <a href="">About Us</a></b>'

var delay_hide=200

var menuobj=document.getElementById? document.getElementById("describe") : document.all? document.all.describe : document.layers? document.dep1.document.dep2 : ""

function showit(which){
thecontent=(which==-1)? "" : submenu[which]
if (document.getElementById||document.all)
else if (document.layers){

function resetit(e){
if (document.all&&!menuobj.contains(e.toElement))
else if (document.getElementById&&e.currentTarget!= e.relatedTarget&& !contains_ns6(e.currentTarget, e.relatedTarget))

function clear_delayhide(){
if (window.delayhide)

function contains_ns6(a, b) {
while (b.parentNode)
if ((b = b.parentNode) == a)
return true;
return false;


09-29-2004, 07:59 PM
Well, the script runs in IE for me, though in Mozilla, there's something wierd. It seems you need to have some content- any content- following the container DIV tag in order to get it to work. So right after the DIV tag:

<div id="describe" style="background-color:cccccc;width:550px;height:30px" onMouseover="clear_delayhide()" onMouseout="resetit(event)"></div>

Some text.
I'm not sure why this is the case yet, though for now, doing the above will work in Mozilla/NS.