advanced code snippet search

Posted By

leandemon on 03/05/08


Tagged

css class alter modify


Versions (?)

Who likes this?

2 people have marked this snippet as a favorite

jamesming
korzhik


Change CSS

 / Published in: JavaScript
 

This JavaScript function will dynamically change the style information for any CSS class in a Web Page. Applying this function to a class will cause all items calling on the class to change to the updated style value. This function works even if there are multiple stylesheets referenced in the document.

Example usage (assuming you have a stylesheet defining the "exampleA" class and "exampleB" id:

changecss('.exampleA','display','none'); changecss('#exampleB','display','none');

Expand | Embed | Plain Text 
  1. function changecss(theClass,element,value)
  2. {
  3.     //documentation for this script at http://www.shawnolson.net/a/503/
  4.     var cssRules;
  5.     if (document.all)
  6.     {
  7.         cssRules = 'rules';
  8.     }
  9.     else if (document.getElementById)
  10.     {
  11.         cssRules = 'cssRules';
  12.     }
  13.  
  14.     for (var S = 0; S < document.styleSheets.length; S++)
  15.     {
  16.         for (var R = 0; R < document.styleSheets[S][cssRules].length; R++)
  17.         {
  18.             if (document.styleSheets[S][cssRules][R].selectorText == theClass)
  19.             {
  20.                 document.styleSheets[S][cssRules][R].style[element] = value;
  21.             }
  22.         }
  23.     }    
  24. }

Report this snippet  

You need to login to post a comment.