jQuery UI Sliders - Select overlapping sliders based on dragging direction

Question

I have this simple jQuery UI Slider setup with a range and a two default values that overlap. The entire thing (with a few bells and whistles) can be found in this jsfiddle:

Answer 1

I tried Yi Jiang's solution with 1.8.12 and it broke on a slider with a single handle, but worked perfectly after I changed

this._originalVal = this.values();

to

this._originalVal = this.options.values === null ? this.value() : this.values();