Принципиально нужно без дополнительных плагинов. Код который привожу работает. Не хватает того, чтобы значение в поле обновлялось про мере перетаскивания ползунка, а не после его отпускания. Как?
//Диапазон значений:
$(function(){
$("input[type=range]").each(function(){
$(this).wrap('<div class="range-wrapper"></div>');
var min = $(this).attr("min");
var max = $(this).attr("max");
var step = $(this).attr("step");
var input = $('<input class="narrow-input" type="number" min="'+min+
'" max="'+max+
'" step="'+step+'">');
$(this).after(input);
$(input).val($(this).val())
$(this).change(function(){
$(input).val($(this).val());
})
$(input).change(function(){
$(input).prev().val($(input).val());
})
});
});
//============================================================