slider: Unexpected Mouse Behavior When Dragging

[rac146]

Actual Behavior:

• md-slider does not behave correctly using a mouse in Google Chrome. The slider does not always follow where I'm dragging the mouse to. Also sometimes the text cursor or the not-available cursor gets displayed and the slider does not move at all. NOTE: This is happening when I drag the circle.
• It happens more often If I try to do multiple drags in a row. (i.e. while keeping the slider focused). If I remove focus from the slider and then drag, it behaves normally.
• It pretty much happens every time if I drag the slider to the max value, then try to drag it back
  • I noticed this beginning with the 1.1.0 release candidates. Back in version 1.0.9 and earlier the sliders perform as expected with a mouse. I do not experience this issue in touch mode.

CodePen (or steps to reproduce the issue): *

• Angular Material Slider Demo Page (http://codepen.io/anon/pen/bwwxJx)

Angular Versions: *

• `Angular Version: 1.5.5
• `Angular Material Version: 1.1.1

Additional Information:

• `Browser Type: Google Chrome
• `Browser Version: 52.0.2743.116
• `OS: Windows 7/Windows 10

[devversion]

I think the dragging will be better after #9362

[fatore]

Didn't improve after that, right?

[andemores]

I know this is a little late, but did you install hammerjs ?

[jack-box]

Still no fix for this? How I install hammerjs and set material to use it?

[Splaktar]

I can reproduce this in 1.1.8. Updated CodePen

AFAIK, there has been no progress made towards supporting HammerJS.

[jack-box]

Ok

I finally end up using other slider for angular
https://github.com/angular-slider/angularjs-slider

Just configure the styling to make it similar to material

Best solution I think, and works perfectly whit the mouse events triggered even when pointer is out of the slider