Input field as label makes the slider handle to move.

[albcl]

I know that there is a way to customise the labels but I can't find a way of giving them a bit more of functionality and not just only minor styling changes.

I'm trying to replace them by input fields so you can either drag the handle or, by clicking in the label, type the amount in it. After that, the slider will receive the new value and will move to the new position.

I would like to just prevent the slider to move when clicking inside the input field, also the slider to allow me to type something in the input field (currently it is like if it was disabled and I can't even type in it)

I hope it makes sense. Here is a quick sample: https://codepen.io/anon/pen/orexdG

[egeniegithub]

You can try something like that.. hide the actual labels if you want by overriding the CSS. and then utilize your on input fields as you like.