Hi,<br />
<br />
I got a tree menu script off the net and have placed in layers (using Dreamweaver). It displays fine in IE, but garbage in Mozilla (all the menu nodes are on top of one another).<br />
<br />
Also, when I use tables, it looks like garbage in IE and Mozilla.<br />
<br />
I suspect it has to do with the fact that the menu must be positioned absolutely on the page, while the layer or the table cell may take it away from this position.<br />
<br />
Any ideas or suggestions?<br />
<br />
Thanks<br />
Hanlie<!--content-->Can we have a link to<br />
1) Your Page<br />
2) The script.<br />
<br />
We may be able to find a better script.<!--content-->I've tried two scripts and neither of them worked.<br />
<br />
I got them from<br />
<br />
<!-- m --><a class="postlink" href="http://javascript.cooldev.com/scripts/cooltree/">http://javascript.cooldev.com/scripts/cooltree/</a><!-- m --><br />
<br />
and<br />
<!-- m --><a class="postlink" href="http://www.softdrawer.com/products/tree/">http://www.softdrawer.com/products/tree/</a><!-- m --><br />
<br />
I can't link to my page 'cause it's on our intranet and I don't have a site where I can post it, but below is the HTML:<br />
<br />
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"<br />
"http://www.w3.org/TR/html4/loose.dtd"><br />
<html><br />
<head><br />
<title>EMG Home</title><br />
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"><br />
<script language="JavaScript" type="text/JavaScript"><br />
<!--<br />
function MM_reloadPage(init) { //reloads the window if Nav4 resized<br />
if (init==true) with (navigator) {if ((appName=="Netscape")&&(parseInt(appVersion)==4)) {<br />
document.MM_pgW=innerWidth; document.MM_pgH=innerHeight; onresize=MM_reloadPage; }}<br />
else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload();<br />
}<br />
MM_reloadPage(true);<br />
//--><br />
</script><br />
<link href=http://www.webdeveloper.com/forum/archive/index.php/"/emg.css" rel="stylesheet" type="text/css"><br />
<link href=http://www.webdeveloper.com/forum/archive/index.php/"cooltree.css" rel="stylesheet" type="text/css"><br />
<script language="JavaScript" src=http://www.webdeveloper.com/forum/archive/index.php/"cooltree.js"></script><br />
<script language="JavaScript" src=http://www.webdeveloper.com/forum/archive/index.php/"tree1_format.js"></script><br />
<script language="JavaScript" src=http://www.webdeveloper.com/forum/archive/index.php/"tree1_nodes.js"></script><br />
</head><br />
<br />
<body><br />
<div id="Layer1" style="position:absolute; left:344px; top:0px; width:630px; height:85; z-index:1; overflow: hidden;"><br />
<h1>EMG Logo </h1><br />
</div><br />
<div id="Layer2" style="position:absolute; left:0px; top:0; width:140; height:450; z-index:1; overflow: visible;"><br />
<script language="JavaScript"><br />
var tree = new COOLjsTree ("tree1", TREE1_NODES, TREE1_FORMAT);<br />
tree.expandNode(0);<br />
tree.expandNode(1);<br />
</script><br />
<br />
</div><br />
</body><br />
</html><br />
<br />
<br />
<br />
Thanks<br />
Hanlie<!--content-->That's not much help because it uses external scripts which you haven't posted...<br />
<br />
Is this the type of menu you want? if so these might be better scripts.<br />
<!-- m --><a class="postlink" href="http://inspire.server101.com/js/xc/">http://inspire.server101.com/js/xc/</a><!-- m --><br />
<!-- m --><a class="postlink" href="http://inspire.server101.com/js/ecms/">http://inspire.server101.com/js/ecms/</a><!-- m --><!--content-->Originally posted by DaveSW <br />
Is this the type of menu you want? if so these might be better scripts.<br />
<!-- m --><a class="postlink" href="http://inspire.server101.com/js/xc/">http://inspire.server101.com/js/xc/</a><!-- m --><br />
<!-- m --><a class="postlink" href="http://inspire.server101.com/js/ecms/">http://inspire.server101.com/js/ecms/</a><!-- m --> <br />
<br />
Yes, thanks, I'll try them.<br />
<br />
Hanlie<!--content-->
<br />
I got a tree menu script off the net and have placed in layers (using Dreamweaver). It displays fine in IE, but garbage in Mozilla (all the menu nodes are on top of one another).<br />
<br />
Also, when I use tables, it looks like garbage in IE and Mozilla.<br />
<br />
I suspect it has to do with the fact that the menu must be positioned absolutely on the page, while the layer or the table cell may take it away from this position.<br />
<br />
Any ideas or suggestions?<br />
<br />
Thanks<br />
Hanlie<!--content-->Can we have a link to<br />
1) Your Page<br />
2) The script.<br />
<br />
We may be able to find a better script.<!--content-->I've tried two scripts and neither of them worked.<br />
<br />
I got them from<br />
<br />
<!-- m --><a class="postlink" href="http://javascript.cooldev.com/scripts/cooltree/">http://javascript.cooldev.com/scripts/cooltree/</a><!-- m --><br />
<br />
and<br />
<!-- m --><a class="postlink" href="http://www.softdrawer.com/products/tree/">http://www.softdrawer.com/products/tree/</a><!-- m --><br />
<br />
I can't link to my page 'cause it's on our intranet and I don't have a site where I can post it, but below is the HTML:<br />
<br />
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"<br />
"http://www.w3.org/TR/html4/loose.dtd"><br />
<html><br />
<head><br />
<title>EMG Home</title><br />
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"><br />
<script language="JavaScript" type="text/JavaScript"><br />
<!--<br />
function MM_reloadPage(init) { //reloads the window if Nav4 resized<br />
if (init==true) with (navigator) {if ((appName=="Netscape")&&(parseInt(appVersion)==4)) {<br />
document.MM_pgW=innerWidth; document.MM_pgH=innerHeight; onresize=MM_reloadPage; }}<br />
else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload();<br />
}<br />
MM_reloadPage(true);<br />
//--><br />
</script><br />
<link href=http://www.webdeveloper.com/forum/archive/index.php/"/emg.css" rel="stylesheet" type="text/css"><br />
<link href=http://www.webdeveloper.com/forum/archive/index.php/"cooltree.css" rel="stylesheet" type="text/css"><br />
<script language="JavaScript" src=http://www.webdeveloper.com/forum/archive/index.php/"cooltree.js"></script><br />
<script language="JavaScript" src=http://www.webdeveloper.com/forum/archive/index.php/"tree1_format.js"></script><br />
<script language="JavaScript" src=http://www.webdeveloper.com/forum/archive/index.php/"tree1_nodes.js"></script><br />
</head><br />
<br />
<body><br />
<div id="Layer1" style="position:absolute; left:344px; top:0px; width:630px; height:85; z-index:1; overflow: hidden;"><br />
<h1>EMG Logo </h1><br />
</div><br />
<div id="Layer2" style="position:absolute; left:0px; top:0; width:140; height:450; z-index:1; overflow: visible;"><br />
<script language="JavaScript"><br />
var tree = new COOLjsTree ("tree1", TREE1_NODES, TREE1_FORMAT);<br />
tree.expandNode(0);<br />
tree.expandNode(1);<br />
</script><br />
<br />
</div><br />
</body><br />
</html><br />
<br />
<br />
<br />
Thanks<br />
Hanlie<!--content-->That's not much help because it uses external scripts which you haven't posted...<br />
<br />
Is this the type of menu you want? if so these might be better scripts.<br />
<!-- m --><a class="postlink" href="http://inspire.server101.com/js/xc/">http://inspire.server101.com/js/xc/</a><!-- m --><br />
<!-- m --><a class="postlink" href="http://inspire.server101.com/js/ecms/">http://inspire.server101.com/js/ecms/</a><!-- m --><!--content-->Originally posted by DaveSW <br />
Is this the type of menu you want? if so these might be better scripts.<br />
<!-- m --><a class="postlink" href="http://inspire.server101.com/js/xc/">http://inspire.server101.com/js/xc/</a><!-- m --><br />
<!-- m --><a class="postlink" href="http://inspire.server101.com/js/ecms/">http://inspire.server101.com/js/ecms/</a><!-- m --> <br />
<br />
Yes, thanks, I'll try them.<br />
<br />
Hanlie<!--content-->