Hiding list items

[AndrewBaines]

I've written a little code to allow list items to be collapsed then shown again as needed. If I initialise the page by hiding everything except the top level, nothing appears on clicking. If I comment out the init code everything works fine with the list appearing and disappearing when clicked.
For the purpose of testing, I've set the class of the top level folders to be empty.
For the code below, init is called onload, then expandcollapse onclick.
Any ideas what's going wrong with init?

My code is:
function init()
{
var coll = document.all.tags("LI");
if (coll != null)
{
for (i=0; i < coll.length; i++)
if (coll.className != '') {
coll.style.display='none';
}
}
}

function expandCollapse ()
{
oSource = event.srcElement;
if (oSource.tagName != "LI")
return;
oChildren = oSource.children;
for (i =0; i<oChildren.length; i++) {
oChild = oChildren;
if (oChild.style.display=='none')
{
oChild.style.display='';
}
else
{
oChild.style.display='none';
}
}
}

Andrew Baines
Chase International

http://www.chase-international.com

 

[BillyRayPreachersSon]

Odd... nothing too out of the ordinary there.

How are your lists structured, btw? I ask as you seem to be looping around all children of the LI hiding / showing them. If the sub-menu items are all contained in a UL, why not just show / hide the single UL instead?

Incidentally, if you want this to work on any browser other than IE, you'll have to change some of your code, too.

Hope this helps,
Dan



[tt]Dan's Page [blue]@[/blue] Code Couch

http://www.codecouch.com/dan/

[/tt]

 

[AndrewBaines]

Not too worried about non-IE - it's an intranet, so locked down desktops.

The menu is multi-level and I don't want multiple levels to be exposed with one click.

If I comment out the init(), everything expands and collapses as it should. It's just that I need it to start collapsed.


Andrew Baines
Chase International

http://www.chase-international.com