I built a working slider. Add the class "slider" to your number field. Put the following code in document ready. This is sort of hacky and may have bugs in scenarios I wasn't trying to support, but it mostly works. 
$(".slider .ginput_container :input").hide();
			  $(".slider .ginput_container .instruction").hide();
			  $("<div class='slider-value'></div>").insertBefore(".slider .ginput_container :input");
			  $("<div class='slider-display'></div>").insertAfter(".slider .ginput_container :input");
			  $(".slider-display").slider({
				  range: "min",
				  value: 1,
				  min: 1,
				  max: 1000,
				  create: function( event, ui ) {
				    var value = $(this).prev(':input').val();
					$(this).siblings('.slider-value').html( value );
					var min = parseInt($(this).next('.instruction').find('strong').eq(0).html());
					var max = parseInt($(this).next('.instruction').find('strong').eq(1).html());
					$(this).slider("option", "min",  min );
					$(this).slider("option", "max",  max);
					$(this).slider("option", "value",  value);
				  },
				  slide: function( event, ui ) {
					var value = $(this).slider( "value" );
					$(this).prev(':input').val(value);
					$(this).prev(':input').trigger("change");
					$(this).siblings('.slider-value').html( value);
				  }
			  });
It grabs the supported range from the instruction field. It's definitely not ideal but I didn't see any other place where that info is available in the DOM.
 
				Posted 12 years ago on Thursday May 2, 2013 | 
Permalink