QSlider: jQuery-based Slider Control

The Slider is a graphical UI component frequently seen in rich client (Windows) applications. It lets the user easily pick a value from a range. You can see the control in action below. Note that the QSlider would not be possible without the tight integration between QCubed and jQuery.

Instantiate a QSlider control just like you would any other QControl. Then, set some its properties:
  • MinValue and MaxValue to define the range from which the user can pick a value.
  • Steps to determine how many steps (discrete points) are there on the continuum between the minimum and maximum values.
  • InitialValue to set the initial value of the slider.
  • CssClass determines the styling on the overall control. Note how the CssClass on the container is set to "ui-slider-1" - there's another sample styles called "ui-slider-2" (look at slider.css for its definition). Feel free to provide your own slider styles!
  • CssClassHandle sets the CSS style for the "grabby thing" (the handle) - the bar that the user drags around to set the value of the control.
  • ShowValueTextBox: a boolean that determines whether the text box showing the currently chosen value is shown. That QTextBox is built into the QSlider.