Class StyleSheet
Create an instance of StyleSheet to encapsulate a css stylesheet.
The constructor can be called using function or constructor syntax.
var sheet = Y.StyleSheet(..);
or
var sheet = new Y.StyleSheet(..);
The first parameter passed can be any of the following things:
- The desired string name to register a new empty sheet
- The string name of an existing StyleSheet instance
- The unique guid generated for an existing StyleSheet instance
- The id of an existing
<link>
or <style>
node
- The node reference for an existing
<link>
or <style>
node
- The Y.Node instance wrapping an existing
<link>
or <style>
node
- A chunk of css text to create a new stylesheet from
If a string is passed, StyleSheet will first look in its static name
registry for an existing sheet, then in the DOM for an element with that id.
If neither are found and the string contains the { character, it will be
used as a the initial cssText for a new StyleSheet. Otherwise, a new empty
StyleSheet is created, assigned the string value as a name, and registered
statically by that name.
The optional second parameter is a string name to register the sheet as.
This param is largely useful when providing a node id/ref or chunk of css
text to create a populated instance.
Constructor
StyleSheet
(
seed
,
name
)
- Parameters:
-
seed
<String|HTMLElement|Node>
a style or link node, its id, or a
name or guid of a StyleSheet, or a string of css text
-
name
<String>
(optional) name to register instance for future static
access
Methods
StyleSheet
disable
(
)
Disable all the rules in the sheet. Rules may be changed while the
StyleSheet is disabled.
Chainable: This method is chainable.
StyleSheet
enable
(
)
Enable all the rules in the sheet
Chainable: This method is chainable.
String
getCssText
(
sel
)
Get the current cssText for a rule or the entire sheet. If the
selector param is supplied, only the cssText for that rule will be
returned, if found. If the selector string targets multiple
selectors separated by commas, the cssText of the first rule only
will be returned. If no selector string, the stylesheet's full
cssText will be returned.
- Parameters:
-
sel
<String>
Selector string
Number
getId
(
)
Get the unique stamp for this StyleSheet instance
- Returns:
Number
- the static id
Boolean
isEnabled
(
)
Returns false if the StyleSheet is disabled. Otherwise true.
StyleSheet
set
(
sel
,
css
)
Set style properties for a provided selector string.
If the selector includes commas, it will be split into individual
selectors and applied accordingly. If the selector string does not
have a corresponding rule in the sheet, it will be added.
The object properties in the second parameter must be the JavaScript
names of style properties. E.g. fontSize rather than font-size.
The float style property will be set by any of "float",
"styleFloat", or "cssFloat".
- Parameters:
-
sel
<String>
the selector string to apply the changes to
-
css
<Object>
Object literal of style properties and new values
Chainable: This method is chainable.
static
Boolean
StyleSheet.isValidSelector
(
sel
)
Determines if a selector string is safe to use. Used internally
in set to prevent IE from locking up when attempting to add a rule for a
"bad selector".
Bad selectors are considered to be any string containing unescaped
`~!@$%^&()+=|{}[];'"?< or space. Also forbidden are . or # followed by
anything other than an alphanumeric. Additionally -abc or .-abc or
#_abc or '# ' all fail. There are likely more failure cases, so
please file a bug if you encounter one.
- Parameters:
-
sel
<String>
the selector string
static
Boolean
StyleSheet.register
(
name
,
sheet
)
Registers a StyleSheet instance in the static registry by the given name
- Parameters:
-
name
<String>
the name to assign the StyleSheet in the registry
-
sheet
<StyleSheet>
The StyleSheet instance
- Returns:
Boolean
- false if no name or sheet is not a StyleSheet
instance. true otherwise.
static
String
StyleSheet.toCssText
(
css
,
cssText
)
Converts an object literal of style properties and values into a string
of css text. This can then be assigned to el.style.cssText.
The optional second parameter is a cssText string representing the
starting state of the style prior to alterations. This is most often
extracted from the eventual target's current el.style.cssText.
- Parameters:
-
css
<Object>
object literal of style properties and values
-
cssText
<String>
(optional) starting cssText value
- Returns:
String
- the resulting cssText string
StyleSheet
unset
(
sel
,
css
)
Unset style properties for a provided selector string, removing
their effect from the style cascade.
If the selector includes commas, it will be split into individual
selectors and applied accordingly. If there are no properties
remaining in the rule after unsetting, the rule is removed.
The style property or properties in the second parameter must be the
JavaScript style property names. E.g. fontSize rather than font-size.
The float style property will be unset by any of "float",
"styleFloat", or "cssFloat".
- Parameters:
-
sel
<String>
the selector string to apply the changes to
-
css
<String|Array>
style property name or Array of names
Chainable: This method is chainable.