Class: MultiStateSpritesIcon

qui.icons.MultiStateSpritesIcon(url, bgWidth, bgHeight, sizeopt, unitopt, statesopt, scaleopt, decorationopt, …args)

An icon with different settings for various states.

Defined icon states are normal, active, focused and selected.

Constructor

new MultiStateSpritesIcon(url, bgWidth, bgHeight, sizeopt, unitopt, statesopt, scaleopt, decorationopt, …args)

Parameters:
Name Type Attributes Description
url String

the URL of the image resource
bgWidth Number

the total width of the image resource
bgHeight Number

the total height of the image resource
size Number <optional>

the size of the icon; defaults to 1
unit String <optional>

the CSS unit used for all dimension attributes; defaults to "rem"
states Object.<String, qui.icons.MultiStateSpritesIcon.StateDetails> <optional>

a mapping with icon states
scale Number <optional>

icon scaling factor; defaults to 1
decoration String <optional>

icon decoration
args * <repeatable>

parent class parameters
Source:

Extends

Methods

applyTo(element)

Apply the icon to an HTML element.

Parameters:
Name Type Description
element jQuery

the element to which the icon will be applied
Overrides:
Source:

hasState(state) → {Boolean}

Tell if the icon has a given state.

Parameters:
Name Type Description
state String
Source:
Returns:
Type
Boolean

renderTo(element)

Effectively render the icon onto the HTML element.

Parameters:
Name Type Description
element jQuery

the element onto which the icon will be rendered
Overrides:
Source:

toAttributes() → {Object}

Return a dictionary of icon attributes that can be passed to constructor.

Overrides:
Source:
Returns:
Type
Object

Type Definitions

StateDetails

Type:
  • Object
Properties:
Name Type Description
offsetX Number

the X offset of the icon in the sprites image
offsetY Number

the Y offset of the icon in the sprites image
filter String

a CSS filter to apply to the icon
Source: