collapsable side bar (IE)

[J]

Hello,

I'd like to create sections that are collapsible via clicking on a
graphic next to (or above) the section (e.g. collapsible cells of a table)

I've given both the graphic and the section an ID property and I have
written this:

function hideShow (name1)
{
if (document.all(n ame1).style.dis play == "none")
document.all(na me1).style.disp lay = "inline"
else
document.all(na me1).style.disp lay = "none"
}

which seems to work, but how can I pass in the image ID and have the
image swapped each time I collapse/expand the section?

any help appreciated,
BK.

[FunGuySF]

The simple answer is, provide a name in the image tag, then:

document.images[imagename].src = "img/image1.jpg";

However, when creating an image swap, you should consider precashing the
images, so the user doesn't get bogged down with a delay (ugly visual
stuff).

To name the image tag:

<img id="image1" border="0" src="img/image1.jpg" />

To precash the images:

var cachedImg = new Object( );
cachedImg['image1'] = new Image();
cachedImg['image1'].src = "img/image2.jpg";

then, when you do the swap:

document.images['image1'].src = cachedImg['image1'].src

That'll do the trick!
"J" <l5*@9klerer.co m> wrote in message
news:ss******** *******@newsfe3-gui.ntli.net...

Hello,

I'd like to create sections that are collapsible via clicking on a graphic
next to (or above) the section (e.g. collapsible cells of a table)

I've given both the graphic and the section an ID property and I have
written this:

function hideShow (name1)
{
if (document.all(n ame1).style.dis play == "none")
document.all(na me1).style.disp lay = "inline"
else
document.all(na me1).style.disp lay = "none"
}

which seems to work, but how can I pass in the image ID and have the image
swapped each time I collapse/expand the section?

any help appreciated,
BK.

[Richard]

On Thu, 13 Jan 2005 22:18:00 GMT J wrote:

Hello, I'd like to create sections that are collapsible via clicking on a
graphic next to (or above) the section (e.g. collapsible cells of a
table) I've given both the graphic and the section an ID property and I have
written this: function hideShow (name1)
{
if (document.all(n ame1).style.dis play == "none")
document.all(na me1).style.disp lay = "inline"
else
document.all(na me1).style.disp lay = "none"
} which seems to work, but how can I pass in the image ID and have the
image swapped each time I collapse/expand the section? any help appreciated,
BK.

DYnamicdrive.co m has a menu called "switch menu" which does what you want.
You can see it in action at my site www.somestuff.batcave.net/
You're close though.
Take a look at their source code to see what they did.

[Dr John Stockton]

JRS: In article <ss************ ***@newsfe3-gui.ntli.net>, dated Thu, 13
Jan 2005 22:18:00, seen in news:comp.lang. javascript, J
<l5*@9klerer.co m> posted :

function hideShow (name1)
{
if (document.all(n ame1).style.dis play == "none")
document.all(na me1).style.disp lay = "inline"
else
document.all(na me1).style.disp lay = "none"
}

function hideShow (name1) { var T = document.all(na me1).style
T.display = (T.display == "none") ? "inline" : "none" }

function hideShow (name1) { with (document.all(n ame1).style)
display = (display == "none") ? "inline" : "none" }

should be more economical equivalents.

--
© John Stockton, Surrey, UK. ?@merlyn.demon. co.uk Turnpike v4.00 IE 4 ©
<URL:http://www.jibbering.c om/faq/> JL/RC: FAQ of news:comp.lang. javascript
<URL:http://www.merlyn.demo n.co.uk/js-index.htm> jscr maths, dates, sources.
<URL:http://www.merlyn.demo n.co.uk/> TP/BP/Delphi/jscr/&c, FAQ items, links.