Skip to content

Frazer/dynamicallyAccessCSS.js

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

8 Commits
 
 
 
 
 
 
 
 

Repository files navigation

dynamicallyAccessCSS.js

edit rules in your css

it is as simple as

`<script src="dynamicallyAccessCSS.js"></script>`

...

onclick="getCSSRule('selectorYouWantToChange').style.colorOrSizeOrWhatever = '3px'"

or

onclick="getCSSRule('selectorYouWantToChange').style.setProperty ("width", "10px", "important")""



if you want to get an array of all of the rules that reference your selector, you use:
getCSSRule('selectorYouWantToChange', true)

to change the last rule
var myRules  = getCSSRule('selectorYouWantToChange', true);
var lastRule = myRules[myRules.length-1]
lastRule.style.colorOrSizeOrWhatever = 'something'

this was inspired here: http://stackoverflow.com/questions/730048/how-to-change-remove-css-classes-definitions-at-runtime

About

edit rules in your css

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published