Unselectable ticks when using ticks_positions

[J0nKn1ght]

Hi, I think that this is possibly similar to issue #528.

When using the ticks_positions option, and a set of non-linear positions, there can be scenarios where certain values can't be selected. Here an example: http://jsfiddle.net/JonKnight/7n3xzmwn/

I worked around this by changing the _getPercentage function so that it would find the closest percentage if ticks_positions was populated:

_getPercentage: function (ev) {
                if (this.touchCapable && (ev.type === 'touchstart' || ev.type === 'touchmove')) {
                    ev = ev.touches[0];
                }

                var eventPosition = ev[this.mousePos];
                var sliderOffset = this._state.offset[this.stylePos];
                var distanceToSlide = eventPosition - sliderOffset;
                // Calculate what percent of the length the slider handle has slid
                var percentage = (distanceToSlide / this._state.size) * 100;
                // If there are tick positions spcified, make sure the percentage hits one of the values
                if (this.options.ticks_positions.length === 0)
                    percentage = Math.round(percentage / this._state.percentage[2]) * this._state.percentage[2];
                else
                    percentage = this._getClosestTickPercentage(percentage);
                if (this.options.reversed) {
                    percentage = 100 - percentage;
                }

                // Make sure the percent is within the bounds of the slider.
                // 0% corresponds to the 'min' value of the slide
                // 100% corresponds to the 'max' value of the slide
                return Math.max(0, Math.min(100, percentage));
            },
            _getClosestTickPercentage: function (percentage) {
                var closestPercentage = null;
                $.each(this.options.ticks_positions, function () {
                    if (closestPercentage == null || Math.abs(this - percentage) < Math.abs(closestPercentage - percentage))
                        closestPercentage = this;
                })
                if (closestPercentage == null)
                    return percentage;
                else
                    return closestPercentage;
            },

This works for me, but I don't know whether there are some other scenarios or edge cases that wouldn't.

Thanks for the great component, by the way.

[phazei]

I wonder if this is at all related to: https://github.com/seiyria/bootstrap-slider/issues/528

[floriancargoet]

I hit the same problem. In my case, the best fix is simple: do not round the percentage.