showing ticks

[pliablepixels]

Hello, I am trying to show 'ticks' at specific instances of the bar. For example, in a range of 1-10, I'd like to show ticks at 1,6,7,8. I tried using modelLabels but that only shows when I slide on that value.

Is this possible? I tried using the scale option, but it looks like scale is for displaying is across the full bar, not at precise locations.

thanks

[darul75]

"Yes you can" by setting the following scale options attribute array :

scale: [{val:1, label:'1'}, {val:6, label:'this is 6'}, ...],

[pliablepixels]

YOU ROCK!!!! It works!! Last question -- can I change the color of the scale labels? I noticed that the scale label is not exactly aligned with the "|" above it though.

FYI here is what I am using it for -- to show alarm frames in a security camera

[darul75]

for each value a different color or globally ?

[pliablepixels]

globally. What I want to do is show the ticks and the labels at the bottom in red (as they are alarm frames). I tried adding scale:{"background-color":"red"}, to options but that was not it

[darul75]

best will be to put your own 'className' attribute name in your slider options object, by instance 'myCameraSlider', then in your css match following css path

.myCameraSlider div.jslider-scale ins {

}

I put an update for scale label not exactly aligned, hope it will match

[darul75]

new release 2.4.0

[pliablepixels]

@darul75 thank you so much.
The color works perfectly.
The alignment however is not fixed in 2.4.0 (I've updated)

Here is what it looks like - I used the "|" character for label so its the same character as the scale