posted on Wednesday, September 22, 2004 9:31 PM by warstar

Javascript Style Sheet change function

Hey all,

The last couple of hours i have been bizzy with some stupid control that i needed that could change the background color, font color and stuff of a StyleSheet so here is the result (i tested it in Firefox and IE):

function StyleSheetChanger(cssClassName,toChange,changeTo)
{
 for(i = 0; document.styleSheets.length > i; i++) //Mozilla
 {
  if(document.styleSheets[i].rules != undefined)
  {
   for(j = 0; document.styleSheets[i].rules.length > j; j++)
   {
    if(document.styleSheets[i].rules[j].selectorText.toLowerCase() == cssClassName)
    {
     document.styleSheets[i].rules[j].style[toChange] = changeTo;
    }
   }
  } else if(document.styleSheets[i].cssRules != undefined) //IE
  {
   for(j = 0; document.styleSheets[i].cssRules.length > j; j++)
   {
    if(document.styleSheets[i].cssRules[j].selectorText.toLowerCase() == cssClassName)
    {
     document.styleSheets[i].cssRules[j].style[toChange] = changeTo;
    }
   }
  } else
  {
   window.alert("Your browser won't support the changing of a style sheet by javascript!");
  }
 }
}

The way that it works is that it will go true all the Style's you have and look for the cssClassName (or what ever it is called) like Body or .MyStyle and change the the propertie of it that you wane change like the background and that's it.

btw dues any one know a good edit for JavaScript because i hate using notepad for stuff like this.

Happy Netting,
Warnar

Comments