i want jquery ui slide with range 1 to 5 with value showingonly start from down to higher range

Here's an example of a jQuery UI slider with a range from 1 to 5, with the value displayed below the slider:

HTML:

<div id="slider"></div>
<div id="slider-value"></div>

JavaScript:

$(document).ready(function() {
  $("#slider").slider({
    range: true,
    min: 1,
    max: 5,
    values: [1, 5],
    slide: function(event, ui) {
      $("#slider-value").html(ui.values[0] + " - " + ui.values[1]);
    }
  });
  $("#slider-value").html($("#slider").slider("values", 0) + " - " + $("#slider").slider("values", 1));
});

CSS:

#slider {
  width: 200px;
  margin-bottom: 20px;
}

#slider-value {
  text-align: center;
  font-size: 20px;
}

In this example, the slider is initialized with a range from 1 to 5, and the default values are set to 1 and 5. The slide event is used to update the value displayed below the slider as the user moves the slider handles.

The CSS styles are optional and can be adjusted to fit your specific needs.