Crestron Components Lib - Showcase App

ch5-slider: ticks

ch5-slider ticks

Defines the ticks on the slider, value should be a valid JSON.

It will be an advanced tick scales: non-linear or logarithmic.

You can create sliders with ever-increasing increments by specifying the value for the slider at certain intervals.

  • The first value define the % position along the length of the slider scale to place a tick mark
  • The second value will be the label value to place next to the tick at that position.

An example would be ticks='{"0":"-60", "25":"-40", "50":"-20", "75":"-10", "100": "0" }'

When using ticks attributes like min, max and step are ignored

<ch5-slider
    value="-40"
    ticks='{"0":"-60", "25":"-40", "50":"-20", "75":"-10", "100": "0" }'
    customStyle="margin-bottom:40px"
    >
</ch5-slider>