JavaScript/jQuery RangeSelector - background.image

You can display an image as the background of a range selector instead of the default color. Set the image's URL and location using the corresponding properties of the image object to do this.

The width of the specified image must be less than or equal to the UI component's width.

The height of the specified image must be less than or equal to the following value ("-" stands for subtract): the UI component's height - the scale's placeholderHeight.

If the image size is smaller than the background size, a default background color will be displayed in the remaining area. You can set a custom color (e.g. an empty color) for the background using the color property of the background configuration object.

View Demo

If the image does not occupy the entire background area, you can set the required background color to be displayed in the remaining area. Use the color property of the background configuration object to do this.