[thelist] Javascript Show/Hide DIV

[Tom McMillen]

> I've got a simple DIV containing some text. The
> visibility of this DIV is
> set to 'hidden', and the idea is when they click the
> appropriate link, the
> visibility gets set to 'visible.'
>
> Pretty simple, right? You'd think so...
>
> I want one function to control the show/hide. Every
> example I've seen of
> something like this has had 2 elements - one
> button/link/graphic to show,
> and one more to hide. I just want one. Here's what I
> came up with:


This is what I use for that sort of functionality...
It works in Mozilla and IE

<script language="Javascript 1.2"
type="text/javascript">
function show(id)
{
	el = document.getElementById(id);
	if (el.style.display == 'none')
	{
		el.style.display = '';
		el = document.getElementById('more' + id);
		el.innerHTML = 'less...';
	} else {
		el.style.display = 'none';
		el = document.getElementById('more' + id);
		el.innerHTML = 'more...';
	}
}

</script>


and then for your link...

<a id="moreinfo"
onclick="javascript:show('info');return false;"
href="info.html" target="_new">more...</a>

<div id="info" style="display: none">
Other Info in Here
</div>

This way if you create an info.html page, users who
don't have javascript enabled will still be able to
see
the extra stuff in a new page too.

Tom



__________________________________________________
Do You Yahoo!?
Everything you'll ever need on one web page
from News and Sport to Email and Music Charts
http://uk.my.yahoo.com