Spirituality

//here you place the ids of every element you want.
var ids=new Array(‘a1′,’a2′,’a3′,’thiscanbeanything’);

function switchid(id){
hideallids();
showdiv(id);
}

function hideallids(){
//loop through the array and hide each element by id
for (var i=0;i<ids.length;i++){
hidediv(ids[i]);
}
}

function hidediv(id) {
//safe function to hide an element with a specified id
if (document.getElementById) { // DOM3 = IE5, NS6
document.getElementById(id).style.display = ‘none’;
}
else {
if (document.layers) { // Netscape 4
document.id.display = ‘none’;
}
else { // IE 4
document.all.id.style.display = ‘none’;
}
}
}

function showdiv(id) {
//safe function to show an element with a specified id

if (document.getElementById) { // DOM3 = IE5, NS6
document.getElementById(id).style.display = ‘block’;
}
else {
if (document.layers) { // Netscape 4
document.id.display = ‘block’;
}
else { // IE 4
document.all.id.style.display = ‘block’;
}
}
}

<a href=”javascript:switchid(‘a2’);”>show a2</a>

Ref : http://support.internetconnection.net/CODE_LIBRARY/Javascript_Show_Hide.shtml
——————————————————————————————————

1. Next Option :
—————————————-
function showlayer(layer){
var myLayer = document.getElementById(layer).style.display;
if(myLayer==”none”){
document.getElementById(layer).style.display=”block”;
} else {
document.getElementById(layer).style.display=”none”;
}
}

<a onclick=”javascript:showlayer(‘myName’)” href=”#”>Hide / Show Layer </a>
Ref :http://woork.blogspot.com/2007/10/show-hide-layer-using-simple-javascript.html

<hr />

Option 2 :
——————————————-
http://www.cssnewbie.com/showhide-content-css-javascript/

<hr />
Option 3:
———————————————-

function toggle_visibility(id) {

var e = document.getElementById(id);

if(e.style.display == ‘block’)

e.style.display = ‘none’;

else

e.style.display = ‘block’;

}

<a onclick=”toggle_visibility(‘foo’);” href=”#”>Click here to toggle visibility of element #foo</a>
<div id=”foo”>This is foo</div>
<hr />