Cross-browser stylesheet creation and css rule creation/deletion (includes IE6 support)
Cross-browser stylesheet creation and css rule creation/deletion (includes IE6 support).
This was created to be a well-tested cross-browser library for basic CSS stylesheet and rule creaton/deletion.
css-controls is available via the following:
npm install css-controls
bower install css-controls
component install css-controls
component, you can load it in as follows:
var cssControls = ;
http, you can use vanilla JS
window.cssControls; // `css-controls` is defined on `window` in camelCase
or you can use AMD
or CommonJS syntax (see
Once you have the module loaded, you can create new style sheets and add/remove CSS rules.
// Create a stylesheet (auto-appended to DOM)var sheet = cssControls;// Color all `p` tags red (ruleIndex = index rule was created at)var ruleIndex = cssControls;// Color the `body` greencssControls;// Remove the first rulecssControls; // Equivalent to cssControls.removeRule(sheet, 0);
css-controls returns 3 cross-browser functions.
cssControls;/*** Create and append stylesheet to DOM* @returns*/
cssControls;/*** Add a CSS rule to a stylesheet* @param* @param* @param* @returns*/
cssControls;/*** Remove a CSS rule from a stylesheet* @param* @param*/
A large amount of the background knowledge came from quirksmode.
css-controls can be used with
document.styleSheets as these are
// Color the `body` via the first stylesheetvar sheet = documentstyleSheets0;cssControls;
In lieu of a formal styleguide, take care to maintain the existing coding style. Add unit tests for any new or changed functionality. Lint via grunt and test via
Copyright (c) 2013 Todd Wolfson
Licensed under the MIT license.