Preserved Topic: Changing className in NS (Page 1 of 1)

onClick="home.className='hidden';news.className='hidden';resume.className='hidden';link.className='shown'

I have the above line of code which will change the class names of some variables. By doing this I am able to change the visability of a layer causing navigation to occure, because of:

.shown
{
visibility: show;
visibility: visible;
}
.hidden
{
visibility: hide;
visibility: hidden;
}

In the CSS. But the onClick doesn't work in NS6, and I am assuming because className is not liked in NS6 anyone have any way to work around this?

Bump for help.

I think I wrote it wrong above. What I am trying to do is in a href I have the onclick even which should change the class reference.

Then in the CSS I have classes shown and hidden each div elements. This class does two things changes the visabily to two different things. One for the NS 6 version and another for the IE, I did not think that the over lapping would make a big difference, but it might, any help here?

searching thru asylum archives for 'visibility'...
mr max says

quote:

---

A little bit fixed code (works in all major browsers):

<SCRIPT TYPE="text/javascript" LANGUAGE="JavaScript">
<!-- ;
function getObj(name) {
if (document.getElementById) {
return document.getElementById(name).style;
} else
if (document.all) {
return document.all[name].style;
} else
if (document.layers) {
return document.layers[name];
}
}

function hideLayer(name) {
getObj(name).visibility = 'hidden';
}

function runTimer() {
setTimeout("hideLayer('layerName')", 10000)
}
// -->
</SCRIPT>

---

___________________
b u n c h a p i x e l s

[This message has been edited by bunchapixels (edited 05-09-2001).]

Instead of changing class, you should hide your layers directly. And here's a little bit better code snippet than that that Buncha has found:

<SCRIPT TYPE="text/javascript" LANGUAGE="JavaScript">
<!-- ;

// Written by mr.maX, http://www.max.co.yu/

function getObj(name) {
&nbsp;&nbsp;&nbsp;&nbsp;if (document.getElementById) {
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;return document.getElementById(name).style;
&nbsp;&nbsp;&nbsp;&nbsp;} else
&nbsp;&nbsp;&nbsp;&nbsp;if (document.all) {
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;return document.all[name].style;
&nbsp;&nbsp;&nbsp;&nbsp;} else
&nbsp;&nbsp;&nbsp;&nbsp;if (document.layers) {
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;return document.layers[name];
&nbsp;&nbsp;&nbsp;&nbsp;}
}

function showLayers(layerName) {
&nbsp;&nbsp;&nbsp;&nbsp;for (i=0; i < arguments.length; i++) getObj(arguments[i]).visibility = 'visible';
}

function hideLayers(layerName) {
&nbsp;&nbsp;&nbsp;&nbsp;for (i=0; i < arguments.length; i++) getObj(arguments[i]).visibility = 'hidden';
}

//-->
</SCRIPT>

And to call it simply use something like this:

<A HREF="javascript:;" ONCLICK="showLayers('L1','L2','L3');">Show Layers</A>
<A HREF="javascript:;" ONCLICK="hideLayers('L1','L2','L3');">Hide Layers</A>

BTW Take a look at this also: http://www.max.co.yu/ozone/multi_divs.html



[This message has been edited by mr.maX (edited 05-09-2001).]

Yeah I have that function working. I was wondering if there was a way to do it by swapping the class name, which would be a little cleaver way to achomplish the task.

It simply isn't meant to be done in that way... Also, why do you think that it would be cleaver way?

I've used Max's method as well. A test can be seen at http://www.development.runningwolf.com/development/code/hide_divs.htm

Pat Richard
A pixel is worth a thousand words.
http://www.gurusnetwork.com
ICQ 23113317

The potensial to cut lots of messy JS out

that's where functions and object creation and object routines come in, warmage.
then it's just "layer.hide()"!

___________________
b u n c h a p i x e l s

Finally, after looking at the code on Pugzly's page I was able to get it to work under NS 6.0 took a while... but it is working thanks for all the help!

WarMage, in case you didn't notice, Pugzly's page uses the same code that's in the page from the link that I've posted above...

And Mr. Max, it's awesome code. I do have one questions about layers and css, though.

Can you have something like <div class=pix id=layer1>blah</div> ?

I need to modify the code I use, because it currently has CSS info for DIV, but I can't have that on the page I'm going to use this on. If I can define a class with that AND use an ID, I should be set.

Pat Richard
A pixel is worth a thousand words.
http://www.gurusnetwork.com
ICQ 23113317

Yes, you can have both CLASS & ID defined...

Yep, I use classes and ID's together quite frequently. The button page I posted in response to your buttons at the GN forum uses both to format the button <div>'s (one sets the 'left' position for all the buttons...the other sets the 'top' position of each indidual button - as well as all the other relevant info ofcourse..).