monster.ui.slider(target, options);


  • target (mandatory)

Type: jQuery object

A jQuery object inside which the slider will be inserted using the append() method.

  • options (mandatory)

Type: Object

Let you specify a map of options for the slider, they are the same than for the jQuery Slider method. It also takes two more custom parameters: - i18n: to define the text in the tooltips - unit: unit of the value for the handles and limits


This method returns the slider container as a jQuery object.


The monster.ui.slider() method allows you to generate a jQuery Slider with the look and feel of Monster UI. All the original options of the slider are available.


  • Create a slider with a max and min handle
var target = $('#slider'),
    options = {
        range: true,
        min: 100,
        max: 50000,
        step: 100,
        value: 1500,
        unit: 'MB',
        i18n: {
            maxHandle: {
                text: 'Throttle Data at:'
            minHandle: {
                text: 'Warn Administrators at:'

monster.ui.slider(target, options);

Edit this page here