473,395 Members | 1,473 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,395 software developers and data experts.

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(name1).style.display == "none")
document.all(name1).style.display = "inline"
else
document.all(name1).style.display = "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.
Jul 23 '05 #1
3 1191
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.com> 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(name1).style.display == "none")
document.all(name1).style.display = "inline"
else
document.all(name1).style.display = "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.

Jul 23 '05 #2
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(name1).style.display == "none")
document.all(name1).style.display = "inline"
else
document.all(name1).style.display = "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.com 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.
Jul 23 '05 #3
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.com> posted :
function hideShow (name1)
{
if (document.all(name1).style.display == "none")
document.all(name1).style.display = "inline"
else
document.all(name1).style.display = "none"
}

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

function hideShow (name1) { with (document.all(name1).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.com/faq/> JL/RC: FAQ of news:comp.lang.javascript
<URL:http://www.merlyn.demon.co.uk/js-index.htm> jscr maths, dates, sources.
<URL:http://www.merlyn.demon.co.uk/> TP/BP/Delphi/jscr/&c, FAQ items, links.
Jul 23 '05 #4

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

2
by: news | last post by:
Is there a way to write an XML doc so that you can still format the text, bold and whatnot, and still have it display in a collapsable tree format? Here's what I'm using as a test: <?xml...
7
by: Rlrcstr | last post by:
How would one implement collapsable paragraphs of text in an HTML page? I want the sections of the document to be expandable for full text or collapsed into just the section heading. Any help is...
12
by: Mark | last post by:
Hi I'm looking to create a colapsable list like what we see in a news reader or on a forum. - Basically, any number of levels up to 10 (i.e. more than whats likely to be needed) - Able to...
1
by: =?Utf-8?B?U2F2dm91bGlkaXMgSW9yZGFuaXM=?= | last post by:
Hi. I have a table that is a master table from which the user views ~300 rows at a time (rarely changing rows in a day). What I want to do is, when the user clicks on a row, to show related...
0
by: Charles Arthur | last post by:
How do i turn on java script on a villaon, callus and itel keypad mobile phone
0
by: ryjfgjl | last post by:
If we have dozens or hundreds of excel to import into the database, if we use the excel import function provided by database editors such as navicat, it will be extremely tedious and time-consuming...
0
by: emmanuelkatto | last post by:
Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud. Please let me know. Thanks! Emmanuel
1
by: nemocccc | last post by:
hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?
1
by: Sonnysonu | last post by:
This is the data of csv file 1 2 3 1 2 3 1 2 3 1 2 3 2 3 2 3 3 the lengths should be different i have to store the data by column-wise with in the specific length. suppose the i have to...
0
by: Hystou | last post by:
There are some requirements for setting up RAID: 1. The motherboard and BIOS support RAID configuration. 2. The motherboard has 2 or more available SATA protocol SSD/HDD slots (including MSATA, M.2...
0
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...
0
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers,...
0
by: Hystou | last post by:
Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.