Need help with collapsible menus in a frame.

[chrscote829]

I am currently working on a frame which contains a main menu. What I need is to have a few of the items expand with some submenu items. I have seen one method on the web, but when a user clicks on a different item while one is expanded, the previous submenus close. Does anyone know how to make it so that the submenus stay down if the user wants them to?

Chris

 

[jaredn]

I would have to see the exact example you are referring to. jared@aauser.com -

http://webfx.eae.net

 

[chrscote829]

Ok, here's a part of the menu I'd like to have on one of my frames:

Home
Serial Numbers
Fordson at Work
Farming
Forestry
City Work
Plowing
My Work
1922 Fordson
Tool Collection
Fairs
...
...
Now what I would like to have the main menu have just the 4 items to the far left. When someone clicks on either "Fordson at Work" or "My Work", these sections will expand to show the indented submenus. I just don't want to make people close one set to view another. Does anyone know how to do this?

Chris

 

[jaredn]

I need to see the code I think. For a cross-dom-compliant-browser version, you can go to:

http://webfx.eae.net/dhtml/xtree/index.html

jared@aauser.com -

http://webfx.eae.net

 

[chrscote829]

OK, here's the code I have. I'm sorry about it being long but I found it on javascript.internet.com. It was the only place I could find anything close to what I wanted.

var nom = 4; // Number of menus
var usePictures = 1; // use pictures? 1 = yes, 0 = no

var ttls = new Array(); // An array for the title objects
var subs = new Array(); // An array for the submenu objects
var lastn;
var lastmove;

if (document.layers) {
visible = 'show';
hidden = 'hide';
}
else
if (document.all) {
visible = 'visible';
hidden = 'hidden';
}
for (var i = 1; i <= nom; i++) {
ttls = ('title' + i);
subs = ('submenu' +i);
}

function lasttoggle(n,move) {
if (n <= nom) {
menu = ('submenu' + n);
if (document.layers) {
submenu = document.layers[menu];
}
else if (document.all) {
submenu = document.all(menu).style;
}
if (submenu.visibility == visible) {
submenu.visibility = hidden;
picclose; // Remove this if you don't use pictures
for (var i = (n+1); i <= nom; i++) {
if (document.layers) {
document.layers[ttls].top -= move;
document.layers[subs].top -= move;
}
else if (document.all) {
document.all(ttls).style.pixelTop -= move;
document.all(subs).style.pixelTop -= move;
}
}
}
}
}

function toggle(n,move) {
menu = ('submenu' + n);
if (document.layers) {
submenu = document.layers[menu];
}
else if (document.all) {
submenu = document.all(menu).style;
}
if (submenu.visibility == visible) {
submenu.visibility = hidden;
if (usePictures) picclose;
for (var i = (n+1); i <= nom; i++) {
if (document.layers) {
document.layers[ttls].top -= move;
document.layers[subs].top -= move;
}
else if (document.all) {
document.all(ttls).style.pixelTop -= move;
document.all(subs).style.pixelTop -= move;
}
}
}
else {
submenu.visibility = visible;
if (usePictures) picopen;
if (lastn != n) {
lasttoggle(lastn,lastmove);
}
for (var i = (n+1); i <= nom; i++) {
if (document.layers) {
document.layers[ttls].top += move;
document.layers[subs].top += move;
}
if (document.all) {
document.all(ttls).style.pixelTop += move;
document.all(subs).style.pixelTop += move;
}
}
}
lastn = n;
lastmove = move;
}

 

[luciddream]

repost your code without tgml processing. adam@aauser.com

 

[chrscote829]

var nom = 4; // Number of menus
var usePictures = 1; // use pictures? 1 = yes, 0 = no

var ttls = new Array(); // An array for the title objects
var subs = new Array(); // An array for the submenu objects
var lastn;
var lastmove;

if (document.layers) {
visible = 'show';
hidden = 'hide';
}
else
if (document.all) {
visible = 'visible';
hidden = 'hidden';
}
for (var i = 1; i <= nom; i++) {
ttls = ('title' + i);
subs = ('submenu' +i);
}

function lasttoggle(n,move) {
if (n <= nom) {
menu = ('submenu' + n);
if (document.layers) {
submenu = document.layers[menu];
}
else if (document.all) {
submenu = document.all(menu).style;
}
if (submenu.visibility == visible) {
submenu.visibility = hidden;
picclose; // Remove this if you don't use pictures
for (var i = (n+1); i <= nom; i++) {
if (document.layers) {
document.layers[ttls].top -= move;
document.layers[subs].top -= move;
}
else if (document.all) {
document.all(ttls).style.pixelTop -= move;
document.all(subs).style.pixelTop -= move;
}
}
}
}
}

function toggle(n,move) {
menu = ('submenu' + n);
if (document.layers) {
submenu = document.layers[menu];
}
else if (document.all) {
submenu = document.all(menu).style;
}
if (submenu.visibility == visible) {
submenu.visibility = hidden;
if (usePictures) picclose;
for (var i = (n+1); i <= nom; i++) {
if (document.layers) {
document.layers[ttls].top -= move;
document.layers[subs].top -= move;
}
else if (document.all) {
document.all(ttls).style.pixelTop -= move;
document.all(subs).style.pixelTop -= move;
}
}
}
else {
submenu.visibility = visible;
if (usePictures) picopen;
if (lastn != n) {
lasttoggle(lastn,lastmove);
}
for (var i = (n+1); i <= nom; i++) {
if (document.layers) {
document.layers[ttls].top += move;
document.layers[subs].top += move;
}
if (document.all) {
document.all(ttls).style.pixelTop += move;
document.all(subs).style.pixelTop += move;
}
}
}
lastn = n;
lastmove = move;
}

Sorry