TK.Gradient

TK.Gradient provides a function to set the background of a DOM element to a CSS gradient according on the users browser and version. TK.Gradient needs a TK.Range to be implemented on.

Properties:
Name Type Attributes Default Description
options.gradient Object | Boolean

Gradient definition for the background. Keys are ints or floats as string corresponding to the widgets scale. Values are valid css color strings like #ff8000 or rgb(0,56,103). If set to false the css style color is used.
options.background String | Boolean <optional>
 "#000000"

Background color if no gradient is used. Values are valid css color strings like #ff8000 or rgb(0,56,103). If set to false the css style color is used.
Source:

Methods

draw_gradient(element, gradientopt, fallbackopt, rangeopt) → {string}

This function generates a string from a given gradient object to set as a CSS background for a DOM element. If element is given, the function automatically sets the background. If gradient is omitted, the gradient is taken from options. Fallback is used if no gradient can be created. If fallback is omitted, options.background is used. if no range is set Gradient assumes that the implementing instance has TK.Range functionality.

Parameters:
Name Type Attributes Default Description
element DOMNode

The DOM node to apply the gradient to.
gradient Object <optional>
 this.options.gradient

Gradient definition for the background, e.g. {"-96": "rgb(30,87,153)", "-0.001": "rgb(41,137,216)", "0": "rgb(32,124,202)", "24": "rgb(125,185,232)"}.
fallback string <optional>
 this.options.background

If no gradient can be applied, use this as background color string.
range TK.Range <optional>
 this

If a specific range is set, it is used for the calculations. If not, we expect the widget itself provides TK.Ranged functionality.
Mixes In:
Source:
Fires:
Returns:

A string to be used as background CSS.

Type
string

Events

backgroundchanged

Is fired when the gradient was created.

Parameters:
Name Type Description
element HTMLElement

The element which background has changed.
background string

The background of the element as CSS color string.
Source: