image

Specifies image options.

Type: Object

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 widget's width.

The height of the specified image must be less than or equal to the following value ("-" stands for subtract): the widget'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.

To see an example of how to show an image in the background, refer to the Customize the Appearance lesson in the Getting Started section.

View Demo

Show Example:
jQuery

In this example, an image of a plane is displayed in the background. The image's location option is changed to 'leftCenter'.


                                    

                                    

location

Specifies a location for the image in the background of a range selector.

Type: String
Default Value: 'full'
Accepted Values: 'full' | 'leftTop' | 'leftCenter' | 'leftBottom' | 'centerTop' | 'center' | 'centerBottom' | 'rightTop' | 'rightTop' | 'rightCenter' | 'rightBottom'

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.

When configuring the widget using ASP.NET MVC Wrappers, specify this option using the BackgroundImageLocation enum. This enum accepts the same values, but they start with an upper-case letter, for example, 'leftTop' becomes LeftTop.

Show Example:
jQuery

In this example, an image of a plane is displayed in the background. The image's location option is changed to 'center'.


                                    

                                    

url

Specifies the image's URL.

Type: String
Default Value: undefined

Show Example:
jQuery

In this example, an image of a plane is displayed in the background. The image's url option is used to set the path to this image. The image's location option is changed to 'rightTop'.