Creates stylesheets out of strings
NOTE: As of v1.1.0, css-injector is now a simple node module. It is no longer a "modified node module" (containing its own extra closure for use directly in a browser).
Bakes one or more baseline mandatory stylesheets into your JavaScript -- i.e., without having to depend on an external .css file. You supply css rules as strings and cssInjector creates <style>...</style> elements and inserts them into your <head>...</head> element (wherever else you want).
cssInjector(stylesheet [ , id [ , refereneceElement ] ] );where:
stylesheetis a string or a list of strings containing css rules.idis an optional string that will get assigned to the<style>tag'sidattributereferenceElementis an optional DOMElementor a string containing a css selector that resolves to a DOM element ornull. Including this parameter forces the new<style>...</style>element to be inserted just before the given element. If omitted (orundefined), the new stylesheet is injected at top of<head>...</head>element. Ifnull, it is inserted at the bottom of the<head>...</head>element.
var stylesheet = [
'div {',
' background-color: red;',
' color: yellow;'
'}'
];
cssInjector(stylesheet);Detailed API docs can be found here.
A demo can be found here.
To use in a browser, you have two options:
- Incorporate the node module into your own browserified project.
- Use the browserified versions
css-injector.jsorcss-injector.min.jsavailable on the Github pages CDN.
See the note Regarding submodules for important information on cloning this repo or re-purposing its build template.