diff --git a/src/nouislider.js b/src/nouislider.js index 7b4820fb..0296429f 100644 --- a/src/nouislider.js +++ b/src/nouislider.js @@ -1566,8 +1566,8 @@ } // Find handle closest to a certain percentage on the slider - function getClosestHandle(proposal) { - var closest = 100; + function getClosestHandle(clickedPosition) { + var smallestDifference = 100; var handleNumber = false; scope_Handles.forEach(function(handle, index) { @@ -1576,11 +1576,19 @@ return; } - var pos = Math.abs(scope_Locations[index] - proposal); + var handlePosition = scope_Locations[index]; + var differenceWithThisHandle = Math.abs(handlePosition - clickedPosition); - if (pos < closest || (pos === 100 && closest === 100)) { + // Initial state + var clickAtEdge = differenceWithThisHandle === 100 && smallestDifference === 100; + + // Difference with this handle is smaller than the previously checked handle + var isCloser = differenceWithThisHandle < smallestDifference; + var isCloserAfter = differenceWithThisHandle <= smallestDifference && clickedPosition > handlePosition; + + if (isCloser || isCloserAfter || clickAtEdge) { handleNumber = index; - closest = pos; + smallestDifference = differenceWithThisHandle; } }); diff --git a/tests/slider_three_or_more_handles.js b/tests/slider_three_or_more_handles.js index fb27ef09..282466e2 100644 --- a/tests/slider_three_or_more_handles.js +++ b/tests/slider_three_or_more_handles.js @@ -77,4 +77,9 @@ QUnit.test("Slider with three or more handles", function (assert) { simulateMousedown(clickTarget, click2x, clickY); assert.deepEqual(slider2.noUiSlider.get(), ["10.00", "17.00", "20.00"], "Expect click nearer middle & right handles to move middle handle"); + slider2.noUiSlider.set([10, 10, 10]); + + simulateMousedown(clickTarget, click2x, clickY); + assert.deepEqual(slider2.noUiSlider.get(), ["10.00", "10.00", "17.00"], "Expect click after last handle with all in the same position to move the last handle"); + });