Java menu help

**Mainer82** · Aug 30, 2003 11:05

I am trying to menu an expandable menu when you click on it. It seems to work ok in IE, but it Doesn't in Mozilla.

Java script (default.js):

Code:

function BrowserCheck() {
	this.ns4 = (document.layers)? true:false;
	this.ie = (document.all && !window.opera)? true:false;
	this.ie4 = (document.all && !document.getElementById)? true:false;
	this.iewin = (window.ActiveXObject)? true:false;
	this.dom = (document.getElementById)? true:false;
	this.gecko = (navigator.userAgent.indexOf('Gecko')!=-1)? true:false;
	this.nsGecko = ((navigator.userAgent.indexOf('Gecko')!=-1)&&navigator.userAgent.indexOf('Netscape')!=-1)? true:false;
	this.opera = (window.opera)? true:false;
	this.mac = (navigator.userAgent.indexOf('Mac')!=-1)? true:false;
	this.iemac = ((navigator.userAgent.indexOf('Mac')!=-1) && (document.all&&(!window.opera)) )? true:false;
}
is = new BrowserCheck()

if (is.dom) {
	//document.write('<link rel="stylesheet" href="style.css" media="all" />')
}

if (is.gecko) {
	/* 
	document.write('<style>');
	document.write('#content { position:relative;top:-1px; }');
	document.write('#contentForum { ;position:relative;top:-1px; }');
	document.write('</style>');
	*/
}

function init() {

}

//window.onload = init;

// these functions are for the menu guide dhtml:

function setDesc(head,text,e) {
  if (!document.getElementById) {
    document.descriptionForm.description.value = head+"\n\n"+text;
  } else {
    // confirmed in newest opera, ie, and moz
    if (!e) e = window.event;
    d = document.getElementById('explanationDiv');
    d.firstChild.firstChild.nodeValue = head;
    d.lastChild.firstChild.nodeValue = text;
    if (document.all && !window.opera) {
        posLeft = document.body.scrollLeft+20+e.clientX;
        posHeight = document.body.scrollTop+10+e.clientY;
        widthSpaceLeft = document.body.clientWidth;
        widthSpaceHeight = document.body.clientHeight;
    } else { // opera does things like moz, nice to know
        posLeft = window.pageXOffset+20+e.clientX;
        posHeight = window.pageYOffset+10+e.clientY;
        widthSpaceLeft = window.innerWidth;
        widthSpaceHeight = window.innerHeight;
    }
    if (posLeft+200 > widthSpaceLeft) {
        posLeft -= 240;
    }
    d.style.left = posLeft+"px";
    d.style.top = posHeight+"px";
    d.style.visibility = "visible";
  }
}

function killDesc() {
    d.style.visibility = "hidden";
}

// this function, is for the extensions listings expanding stuff

t = new Image();
t.src = "images/bookclosed.PNG";
d = new Image();
d.src = "images/bookopen.PNG";

function extension(header) {
    if (header.nextSibling) {
        if (header.nextSibling.style.display == "block") {
            header.title = "Click to expand";
            header.nextSibling.style.display = "none";
            header.parentNode.style.backgroundImage = "url('images/bookclosed.PNG')";
        } else {
            header.title = "Click to collapse";
            header.nextSibling.style.display = "block";
            header.parentNode.style.backgroundImage = "url('images/bookopen.PNG')";
        }
    }
}

function expandAllCategories(button) {
    var doAction = "";
    if (button.value== "Expand all categories") {
        doAction = "Expand";
        button.value = "Collapse all categories";
    } else {
        doAction = "Collapse";
        button.value = "Expand all categories";
    }

    if (document.getElementsByTagName) {
        var p = document.getElementsByTagName("p");
        for (var i = 0; i < p.length; i++ ) {
            if (p[i].className == "extensionCategory") {
                if (doAction=="Expand") {
                    if (!(p[i].nextSibling.style.display == "block")) {
                        p[i].click();
                    }    
                } else {
                    if (p[i].nextSibling.style.display == "block") {
                        p[i].click();
                    }
                }
            }
        }
    }
}

HTML:

HTML Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
	<title></title>
	<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" /> 
	<script src="default.js" type="text/javascript"></script>
	<link rel="stylesheet" type="text/css" href="style.css" />
</head>
<body>
<br />
<a href="index.html" target="_top">Home</a>
<br />
<br />
<a href="backup.html" target="main">Backup your registry</a>
<br />
<a href="contact.html" target="main">Contact Us</a>
<br />
<br />     

<div class="extensionsList">
 <div><p class="extensionCategory" onclick="extension(this);" title="Click to expand">Desktop Tweaks</p> 
 <ul>
  <li><a href="associateanicondrive.html" target="main">Associate an icon with a drive</a>
  </li>
  <li><a href="">.....</a>
  </li>
  <li><a href="">....</a>
  </li>
  <li><a href="">....</a>
  </li>
  <li><a href="">....</a>
  </li>
 </ul>
 </div>   
</div>
</body>
</html>

CSS (style.css):

Code:

.extensionsList div {
	font-size: 11px;
}
.extensionsList div li {
	font-size: 11px;
}
#explanationDiv {
	padding: 3px;
	position: absolute;
	top: 0;
	left: 0;
	visibility: hidden;
	color: InfoText;
	background: InfoBackground;
	width: 200px;
	border: 1px solid black;
}

#explanationDiv h2 {
	font-size: 12px;
	font-weight: 900;
	color: InfoText;
	background: InfoBackground;
	margin: 2px 2px 2px 2px;
}

#explanationDiv p {
	color: InfoText;
	background: InfoBackground;
	margin: 2px 2px 2px 2px;
}

/* some messing with margins, to get it all to look nice */
.extensionsList div p {
	display: inline;
}
.extensionsList div ul {
	margin-top: 0.5em;
	margin-bottom: 0.5em;
}
.extensionCategory {
	cursor: pointer;
}
.extensionsList div {
	padding-left: 20px;
	margin-left: 1em;
	background-image: url('images/bookclosed.PNG');
	background-position: 0 0;
	background-repeat: no-repeat;
}
.extensionsList div ul {
	display: none;
}

What am I doing wrong?

**Mainer82** · Aug 31, 2003 11:11

Anyone?

User Tag List

Thread: Java menu help

Thread Tools

Display

Java menu help

Bookmarks

Bookmarks

Posting Permissions