Scroll

Slider Range

Follow
Summary This article give you access to the Slider Range Javascript control. You also got access to a live example, qex file example and details of the parameters available for this control.
Applies to askiadesign
Written for Scriptwriters and survey authors
Keywords adc; adc2; javascript; control; design; askiadesign; adc2-sliderRange

  • To download the qex file, click here
  • To download the ADC control, click here
  • Version of the adc: 1.0.3

This control is compatible with multiple, numeric questions. Number minimum of responses : *. Number maximum of responses : *. You can use the following controls : responseblock.

 

Parameters Type Comments and/or possible value
     
Slider Configuration    
Start Value string Description : The first value of the slider
Value : 33
Options : 0%, 25%, 33%, 50%, 66%, 75%
End Value string Description : The last value of the slider
Value : 66
Options : 25%, 33%, 50%, 66%, 75%, 100%
Margin Value number Description : Value of the minimum distance of the two handles
Value : 0
Tooltip boolean Description : Display or no tooltips
Value : false
Orientation string Description : Orientation of the slider
Value : horizontal
Options : horizontal, vertical
Direction string Description : Direction of the slider
Value : ltr
Options : Left to Right, Right to Left
Height string Description : Height of the slider
Value : 20px
Width string Description : Width of the slider
Value : 500px
Slider Max Width string Description : The max Width of the slider
Value : 100%
Slider Color color Description : The color of the slider when not focus
Value : 250,250,250
Selected Slider Color color Description : The color of the slider when focus
Value : 0,124,196
For Numeric    
Step number Description : The step between two value
Value : 1
Scale And Label Configuration    
Display scale string Description : Display the scale
Value : block
Options : yes, no
Scale max width string Description : Scale disapear when the browser's size is inf or equal to the value
Value : 240px
Scale Density number Description : Density of the scale
Value : 1
Scale Values Font Size string Description : Pips font size in scale
Value : 10px
Scale Values Color color Description : Scale Values Color
Value : 153,153,153
ColorFormat : rgb
Scale Color color Description : Color of the scale
Value : 153,153,153
ColorFormat : rgb
Selected Scale Values Font Size string Description : Selected Scale Values Fond Size
Value : 16px
Selected Scale Values Color color Description : Selected Scale Values Color
Value : 153,153,153
ColorFormat : rgb
Right Label string Description : A label display at the right of the slider (in horizontal position) or at the bottom (in vertical position)
Value : Right side
Left Label string Description : A label display at the left of the slider (in horizontal position) or at the top (in vertical position)
Value : Left side
Labels Font Size string Description : The font size of labels
Value : 20px
Label Alignment string Description : Alignment of the two labels
Value : side
Options : Side, Top, Bottom
Label Color color Description : Color of the two labels
Value : 68,68,68
ColorFormat : rgb
Label Background Color color Description : Color of the two labels
Value : 250,250,250
ColorFormat : rgb
Top Label Array string Description : All labels which will be display on the top of the slider
Top Label Position string Description : Position of the different labels
Labels Border Style string Description : The style of the border
Value : solid
Options : None, Solid, Dashed, Dotted, Double
Labels Border Thickness string Description : The thickness of the border around the labels responses
Value : 1px
Options : None, 1px, 2px, 3px, 4px, 5px
Labels Border Color color Description : The color of the border
Value : 68,68,68
ColorFormat : rgb
Labels Max Width string Description : The max width of labels
Value : 200px
Labels Padding string Description : Padding of the differents labels
Value : 5px
Responsive Side Width number Description : number of pixel when side alignment become top
Value : 300
Exclusives Responses    
Exclusive Width string Description : max width of exclusives buttons
Value : 200px
Exclusive Alignment string Description : Position of the exclusives responses
Value : center
Options : Right, Left, Center
Exclusive Font Size string Description : Font size of exclusives responses
Value : 16px
Exclusive Font Color color Description : Font color of exclusives button
Value : 68,68,68
ColorFormat : rgb
Exclusive Background Color color Description : The color of the background
Value : 232,232,232
ColorFormat : rgb
Exclusive Border Style string Description : The style of the border
Value : solid
Options : None, Solid, Dashed, Dotted, Double
Exclusive Border Thickness string Description : The thickness of the border around the exclusives responses
Value : 1px
Options : None, 1px, 2px, 3px, 4px, 5px
Exclusive Border Color color Description : The color of the border
Value : 68,68,68
ColorFormat : rgb
Hover Exclusive Font Color color Description : Font color of exclusives responses on hover
Value : 68,68,68
ColorFormat : rgb
Hover Exclusive Background Color color Description : Color of the background on hover
Value : 243,243,243
ColorFormat : rgb
Hover Exclusive Border Style string Description : Border style on hover
Value : solid
Options : None, Solid, Dashed, Dotted, Double
Hover Exclusive Border Thickness string Description : The thickness of the border around the exclusives responses on hover
Value : 1px
Options : None, 1px, 2px, 3px, 4px, 5px
Hover Exclusive Border Color color Description : The color of the border
Value : 68,68,68
ColorFormat : rgb
Selected Exclusive Font Color color Description : Font color of exclusives responses when selected
Value : 255,255,255
ColorFormat : rgb
Selected Exclusive Background Color color Description : Color of the background when selected
Value : 0,157,251
ColorFormat : rgb
Selected Exclusive Border Style string Description : Border style when selected
Value : solid
Options : None, Solid, Dashed, Dotted, Double
Selected Exclusives Border Thickness string Description : The thickness of the border around the exclusives responses when selected
Value : 1px
Options : None, 1px, 2px, 3px, 4px, 5px
Selected Exclusive Border Color color Description : The color of the border
Value : 255,255,255
ColorFormat : rgb
Format Configuration    
Decimal Number number Description : The number of decimal in slider values
Value : 0
Decimal Separator string Description : The string or char used to separate real part and decimal part on a number
Thousand Separator string Description : The string or char used to separate thousands part
Value :
Prefix string Description : The prefix of all values in the slider
Postfix string Description : The postfix of all values in the slider
Negatives Mark string Description : The string or char used to show the number is under 0
Value : -
Have more questions? Submit a request

Comments