Telerik UI for Windows 8 HTML

This article explains the visual elements of the RadSlider and RadRangeSlider controls.

Visual Structure

Visual structure

Description of Elements




The scale is used to visualize the range of values selectable by the slider.

Drag Handle(s)

Could also be referred to simply as "handle". There is one drag handle in RadSlider for selecting a value and two in RadRangeSlider for selecting a range on the scale.

Major Ticks

These lines mark the large steps on the scale. Large steps are intervals between major divisions of the scale.

Minor Ticks

These lines mark the small steps on the scale. Small steps are intervals between minor divisions of the scale.


Placed next to each major tick, used to display the value it corresponds to.


Shows when dragging a handle to select a value/range. It displays the value/range corresponding to the current position of the handle(s).


Buttons can be shown only in RadSlider. They are placed at the two ends of the scale and are used to increase or decrease the selected value. Clicking a button changes the selection by taking out or adding up the value specified as a small step.


Can be seen only in RadRangeSlider. This is the highlighted part of the scale between the two drag handles. It is the visual representation of the range of selected values in the control.