Example of Vertical Orientation in Javascript Range Slider Control

Vertical Orientation

This sample demonstrates the rendering of Slider component in Vertical orientation. Drag the thumb over the bar for selecting the values between min and max.

More Details...


The Slider component allows to select a value or range of values in-between a min and max range, by dragging the thumb over the slider bar in vertical orientation. Three types of sliders in vertical orientation are: Default - allows to select a single value in vertical orientation MinRange – allows to select a single value, but highlights with a range selection from the min value to the current handle value in vertical orientation Range – allows to select a range of values with two handles, where the handles are connected with a range selection in vertical orientation Reverse – Allows to render the component in reverse order. To utilise this, set the maximum value to the Min property and set the minimum value to the Max property In this demo, the default, MinRange, and range slider types can be seen. The dragInterval is used to drag the slider's both handles using the range bar and it is applicable only to range slider. For more information, refer to the orientation section from the documentation.