Web Development with jQuery (2015)

Slider Methods

Method

Description

Return Value

slider(options)

Makes the selected elements into slider elements (see “Slider Options”).

jQuery

slider('destroy')

Completely removes the sliding functionality.

jQuery

slider('disable')

Disables the slider.

jQuery

slider('enable')

Enables the slider.

jQuery

slider('option')

Returns an object of key, value pairs representing all options presently set for that instance of the slider plugin.

Object

slider('option', optionName)

Returns the value of the specified option.

Mixed

slider('option', optionName,value)

Sets the value of the specified option to the specified value.

jQuery

slider('option', optionObject)

Sets multiple options using an object of key, value pairs.

jQuery

slider('value')

Returns the value of the slider.

Number

slider('value', value)

Sets the value of the slider.

jQuery

slider('values')

Returns all values for all handles.

Array

slider('values', index)

Returns the value for the specified handle.

Number

slider('values', index, value)

Sets the value of the specified handle.

jQuery

slider('values', valuesArray)

Sets the values of the specified handles using an array.

jQuery

slider('widget')

Returns a jQuery object containing the slider.

jQuery

Slider Options

Option

Description

Type

animate

Whether slide handles smoothly when the user clicks outside the handle on the bar.
Default value: false

Boolean

disabled

Disables the slider if set to true.
Default value: false

Boolean

max

The maximum value of the slider. Useful for tracking values via callback and to set steps.
Default value: 100

Number

min

The minimum value of the slider.
Default value: 0

Number

orientation

Determines whether the slider is moved horizontally or vertically. The possible values are horizontal and vertical.
Default value: horizontal

String

range

If a boolean is provided and set to true, the slider will detect if you have two handles and creates a stylable range element between these two. You now also have access to ui.range in your callbacks to get the amount of the range.
If a string is provided the potential values are min and max.
Default value: false

Boolean, String

step

Determines the interval between each step the slider takes between min and mx. The full range should be easily divided by the step.
Default value: 1

Number

value

The value of the slider. If multiple handles are present, this value will be used for the first handle.
Default value: 0

Number

values

If multiple handles are desired, an array containing the value for each handle can be provided within this option.
Default value: null

Array

Slider Events

Option

Description

Value

change

A function that is executed when the slider's value or values change.

function(event, ui)

create

A function executed when a slider is created.

function(event, ui)

slide

A function executed upon every mouse move while a slider is being dragged.

function(event, ui)

start

A function that gets called when the user starts sliding.

function(event, ui)

stop

A function that gets called when the user stops sliding.

function(event, ui)

UI Object

Option

Description

Type

ui.handle

A jQuery object representing the handle being moved.

jQuery

ui.value

The value that the handle will move to if the event is not canceled.

Number

ui.values

An array of the current values of a multihandled slider.

Array