• Fluent
  • Fluent Dark
  • Bootstrap v5
  • Bootstrap v5 Dark
  • Tailwind CSS
  • Tailwind CSS Dark
  • Material
  • Bootstrap v4
  • High Contrast
Mode Selection
Theme Selection
*Translated by Google Translator.
Essential Studio
All Controls

Example of Vertical Orientation in ASP.NET Core Range Slider Control

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.


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.

The dragInterval is used to drag both handles using the range bar which is also applicable only to the range slider.

In this demo, the default, MinRange, and range slider types can be seen.