Skip to main content
R
RedButNoDead
Inspiring
April 24, 2023
Answered

Make step on slider or scroll bar element as HTML input range element

  • April 24, 2023
  • 1 reply
  • 1183 views

In HTML5 there is an input type="range" element with which you can set the slider's movement step to the desired number:
<input type="range" min="0" max="70" step="0.05" >
In the example above, the step is 0.05 and it is not possible to select a number on the slider that is not a multiple of 0.05.
Is it possible to do something similar in the Window('dialog') object?
I tried stepdelta and jumpdelta of the Scrollbar object, but there is a difficulty.
If I move the slider to, for example, 2.35 with steps set to 1 unit, when I apply the step the slider will set to either 3.35 or 1.35 depending on the direction.
It is necessary that the slider's movement be clear only on the numbers that are specified in the step property.
For example, if the step is 0.5, the slider can only take values equal to half a unit.

This topic has been closed for replies.
Correct answer jazz-y

With each change in the position of the slider, we can adjust its value by the amount we need:

 

var step = 0.5;
var w = new Window("dialog"),
st = w.add("statictext {text:'00000'}"),
sl = w.add("slider {minvalue:0, maxvalue:70, value:0, preferredSize:[200,-1]}");
sl.onChanging = function (){st.text = this.value = Math.round(this.value/step)*step;}
w.onShow = function (){st.text = sl.value}
w.show();

 

 

 
 

 

 

1 reply

J
jazz-yCorrect answer
Legend
April 24, 2023

With each change in the position of the slider, we can adjust its value by the amount we need:

 

var step = 0.5;
var w = new Window("dialog"),
st = w.add("statictext {text:'00000'}"),
sl = w.add("slider {minvalue:0, maxvalue:70, value:0, preferredSize:[200,-1]}");
sl.onChanging = function (){st.text = this.value = Math.round(this.value/step)*step;}
w.onShow = function (){st.text = sl.value}
w.show();

 

 

 
 

 

 

    R
    RedButNoDeadAuthor
    Inspiring
    April 24, 2023

    Thank you. Very elegant solution. And how simple.))

    Terms & ConditionsAccessibility statement
    Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices