Gossamer Forum
Home : General : Internet Technologies :

Javascript Show/Hide DIV

Quote Reply
Javascript Show/Hide DIV
I'm using the following code to hide/show a div layer by clicking a button. Once clicked, the button changes from show to hide and then back from hide to show when you click it again.

Code:
<SCRIPT LANGUAGE="JavaScript">
<!--

NS4 = (document.layers) ? 1 : 0;
IE4 = (document.all) ? 1 : 0;
ver4 = (NS4 || IE4) ? 1 : 0;

isExpanded = false;

function getIndex(el) {
ind = null;
for (i=0; i<document.layers.length; i++) {
whichEl = document.layers[i];
if (whichEl.id == el) {
ind = i;
break;
}
}
return ind;
}

function arrange() {
nextY = document.layers[firstInd].pageY + document.layers[firstInd].document.height;
for (i=firstInd+1; i<document.layers.length; i++) {
whichEl = document.layers[i];
if (whichEl.visibility != "hide") {
whichEl.pageY = nextY;
nextY += whichEl.document.height;
}
}
}

function initIt(){
if (!ver4) return;
if (NS4) {
for (i=0; i<document.layers.length; i++) {
whichEl = document.layers[i];
if (whichEl.id.indexOf("Child") != -1) whichEl.visibility = "hide";
}
arrange();
}
else {
divColl = document.all.tags("DIV");
for (i=0; i<divColl.length; i++) {
whichEl = divColl(i);
if (whichEl.className == "child") whichEl.style.display = "none";
}
}
}

function expandAll() {
if (!ver4) return;

if (NS4) {
document.images["imgEx"].src = newSrc;
for (i=firstInd; i<document.layers.length; i++) {
whichEl = document.layers[i];
if (whichEl.id.indexOf("Parent") != -1) {
whichEl.document.images["imgEx"].src = newSrc;
}
if (whichEl.id.indexOf("Child") != -1) {
whichEl.visibility = (isExpanded) ? "hide" : "show";
}
}

arrange();
if (isExpanded) scrollTo(0,document.layers[firstInd].pageY);
}
else {
divColl = document.all.tags("DIV");
for (i=0; i<divColl.length; i++) {
if (divColl(i).className == "child") {
divColl(i).style.display = (isExpanded) ? "none" : "block";
}
}
imColl = document.images.item("imgEx");
for (i=0; i<imColl.length; i++) {
imColl(i).src = newSrc;
}
}

imgEx.src = (isExpanded) ? "<%image_url%>/show.gif" : "<%image_url%>/hide.gif";
isExpanded = !isExpanded;
}

onload = initIt;

//-->
</SCRIPT>

The problem I'm having is that with Netscape the div is visible all the time and pressing the button does nothing.

It works great with IE though.

I'm hoping TheStone or someone can shed some light as to why it doesn't work with NS :)

Thanks.

Last edited by:

Paul: Jun 20, 2002, 4:46 AM
Quote Reply
Re: [Paul] Javascript Show/Hide DIV In reply to
Why a so complicated javascript ???

Keep it simple, and javascript can be very simple. Have a look at the website of Peter Paul at http://www.xs4all.nl/~ppk/js/. He has simple script with detailed explamation available.
Quote Reply
Re: [cK] Javascript Show/Hide DIV In reply to
Hey, nice link. Thanks for sharing it.


http://www.iuni.com/...tware/web/index.html
Links Plugins