[headbirth]

Hi,

I'm trying to ceate a Javascript that will toggle a classes visibility. i.e. an objects contents will hide it's self or make it's self visible on clicking a link.

Anyone have any idea how I might go about this or refer me to a reference that might help.

Thanks!

[Chris O'Brien]

document.getElementById("the_element_id").style.vi sibility = "hidden";

use "visible" to make it visible...

however, you mentioned a class - so is this for a bunch of objects all with the same class? If so, you can modify the CSSStyleRule that's relevant.

[Cocoaholic]

Code:
<script language="JavaScript" type="text/JavaScript">
<!--
function toggle() {
	if (document.getElementById("popup").style.visibility == "hidden") {
		document.getElementById("popup").style.visibility = "visible";
	} else {
		document.getElementById("popup").style.visibility = "hidden";
	}
}
//-->
</script>

<a href="javascript:toggle();">toggle</a> 

<div id="popup">hello</div>

[headbirth]

Actually, I'm going to need some sort of array, so I can hide one object and show another.

Something like this I guess:

var pcount = 1;
function goNext(oneClicked,class1,class2) {
if (oneClicked=="prev") {
if (pcount==1) {
alert("This is the first part.")
}
else {
pcount = --pcount;
}
}
else {
if (pcount==2) {
alert("This is the last part.")
}
else {
pcount = ++pcount;
}
}
switch (pcount) {
case 1 :
p1.className = class1;
p2.className = class2;
break;
case 2 :
p1.className = class2
p2.className = class1;
break;
}
}

[headbirth]

Actually, I'm going to need some sort of array, so I can hide one object and show another.

Something like this I guess:

var pcount = 1;
function goNext(oneClicked,class1,class2) {
if (oneClicked=="prev") {
if (pcount==1) {
alert("This is the first part.")
}
else {
pcount = --pcount;
}
}
else {
if (pcount==2) {
alert("This is the last part.")
}
else {
pcount = ++pcount;
}
}
switch (pcount) {
case 1 :
p1.className = class1;
p2.className = class2;
break;
case 2 :
p1.className = class2
p2.className = class1;
break;
}
}

Except this doesn't work with Netscape (Gecko):

[headbirth]

Here's what I'm trying to do:

http://home.earthlink.net/~headbirth...ng/index2.html

I want to be able to click on the Identity Design Type and havee the top 4 rows hide and show 4 new ones. I have some code in place that does this, but it doesn't work with netscape.

Any help would be appreciated ..

[headbirth]

I think these are the actions I'm trying to accomplish:

Toggle CSS Visibility for:

Hide Intro page and reveal Navbar and Case Studies page

Show/Hide Identity Design Sets 1 & 2
Show/Hide Publishing Design Sets 1 & 2

Show News blog and hide Case Studies
Show Case Studies and hide News page
Show Contact page and hide News and Case Studies page

Viewer:
clicking on a case study hides case study and shows item plus inserts an image into the cell based on what item was clicked ...

Navbar remove/deactivate or insert an items link depending on a click.

Resonable? :-)