[WSG] Modify class (hope to bring closure ;-)

[Taco Fleur]

Title: Modify class

Hi Guys,

 

I just wanted to touch the subject again, as it did not bring closure to my problem last time, ie. most of you pointed me in the right direction but I still don't have it working fully, Lindsay; your example did display the hidden items but it did not hide them again.

 

I came up with the following, which also displays the hidden items but again it does not hide them.

 

<link href="" rel="stylesheet" type="text/css">
<script>
function replaceRule( objStyle, className, newClassName )
{
 var r = objStyle.rules
 for ( var i = 0; i < r.length; i++ )
 {
  if( r[i].selectorText == className )
  {
   objStyle.removeRule( i );
   objStyle.addRule( className, newClassName, i );
   return;
  }
 }
}
</script>

<a href="" >test</a>
<div class="helpItem">
<img src="" alt="Click here for help on this item"> Click on any item to display help.</div>

I was also thinking maybe it's easier (if possible) to have two classes like so;

 

.international {
 visibility: hidden;
 display: none; }

 

.national {

 visibility: visible;
 display: inline;}

 

and then do something like switchRule( document.styleSheets[0], '.international' , '.national' )

But how? There doesn't seem to be much documentation out there about dynamic stylesheets, or a nice PDF Reference, like Netscape brought out for Client-Side _javascript_ Reference