bootstrap-slider
bootstrap-slider copied to clipboard
If using "ticks_positions" - slider broken
Hello,
If using "ticks_positions" option - slider becomes broken. Please check video: https://monosnap.com/file/VsKK1OV84M3Tn3AwRWnGy7U77rOaU2
Please provide a jsfiddle, not a video.
You can check this jsfiddle: http://jsfiddle.net/h3WDq/752/ Please check second slider ("horizontal tick labels with fixed positioning not working"). This fiddle is not mine, but problem is the same.
ping?
Any update here?
Guys, if you set values of options ticks
, ticks_labels
and ticks_positions
in reverse order, then slider should work.
My example on jsfiddle: http://jsfiddle.net/6ecbzwgc/2/
@marphi Congrats! You found a secret! :)
Hello guys, i was having this issue when using slider inside a modal or inside a accordion, i dont know how to technically explain why this was happening, but i am able to fix this simply destroying the slider and recreating it, just bind this actions on modal shown event or on collapse shown event.
if you have more than one slider and are using collapse (the same conception it's applied to modal):
EG:
$('#YOUR_COLLAPSE_DIV').on('shown.bs.collapse', function (e) {
$(e.currentTarget).find(".YOUR_CLASS_USED_IN_SLIDER").each(function () {
$(this).slider("destroy");
$(this).slider({
//tooltip_position: 'bottom',
ticks: YOURTICKS,
ticks_labels: YOURTICKSLABELS,
ticks_snap_bounds: YOURTICKSSNAPBOUNDS
});
});
});
Example 14 in the documentation, which gives an example of tick positions, doesn’t work as shown. The HTML versions needs to use "data-slider-ticks-positions" not "tick_positions" as shown in the example.