behavior:slider

behavior:slider

This behavior provides slider functionality..

Elements

that have this behavior applied by default to:

  • <input|hslider> – horizontal slider;
  • <input|vslider> – vertical slider.

Note: in order to create slider that supports float range the element must have at least min and max attributes defined as float numbers, for example :
<input|hslider min="0.0" max="1.0" step="0.01">

Model

Upon initialization the behavior creates following DOM structure:

<input type=hslider>
  <button.slider />
</input>

Where <button.slider> is slider’s "knob".

Attributes

this behavior knows about:

min
integer|float, initial minimal value;
max
integer|float, initial maximal value;
step
integer|float, intitial step value, click on left/right sides of the slider de-/increments the value by this amount.
value
integer|float, initial value of the input
buddy
string, ID of "buddy" element, usually some <span> that receives textual representation of the value.

Methods

sliderMin
() : integer|float
reports current (runtime) minimal value.
sliderMax
() : integer|float
reports current (runtime) maximal value.
sliderStep
() : integer|float|undefined
reports current (runtime) step value.
sliderRange
(min : integer|float, max : integer|float [, step : integer|float])
sets range and optionally step.

Events

BUTTON_STATE_CHANGED
– posted when value of the input is changed by the user.
BUTTON_CLICK
– posted when user has finished editing.

Value

integer|float, the value of the input, in range [ min … max ].