How to show slider values above slider handle, rather than adjacent to the scale | XM Community
Skip to main content
Question

How to show slider values above slider handle, rather than adjacent to the scale

  • February 15, 2019
  • 7 replies
  • 153 views

DannyDelve
Forum|alt.badge.img+2
Hi everyone, On a constant sum question I would like to display slider values above the slider handle as the respondent moves the slider, rather than to the right of the scale as appears to be the default. Is there a way to implement this? Thanks for any assistance with this, Danny

7 replies

rondev
Level 6 ●●●●●●
Forum|alt.badge.img+22
  • Level 6 ●●●●●●
  • April 21, 2019
@DannyDelve - Add a span element before slider and change its value on the event change of the text input of qualtrics and hide this text input using JS

SaurabhPujare_Ugam
QPN Level 5 ●●●●●
Forum|alt.badge.img+18
Hi Danny, Hope this thread helps

DannyDelve
Forum|alt.badge.img+2
  • Author
  • April 22, 2019
> @SaurabhPujare_Ugam said: > Hi Danny, > > Hope this thread helps Thank you Saurabh - would you mind please re-posting the thread link, as it's not working for me? Much appreciated!

Elitza_17
Forum|alt.badge.img+1
  • November 26, 2019
Hello @DannyDelve, I was wondering if you could open that thread? I also can't open it. I have similar question to yours and I thought it might be helpful for me as well - I want to have the value of a Custom Start Position shown just above the slider handle - it writes the value above when I move the handle, but I also need to have the initial value shown. Thank you!

DannyDelve
Forum|alt.badge.img+2
  • Author
  • November 26, 2019
Hi @Elitza_17 - no, sorry I never got to find that thread. Maybe @SaurabhPujare_Ugam could re-post it here? Thanks!

Elitza_17
Forum|alt.badge.img+1
  • November 26, 2019
Hi @DannyDelve, thanks a lot for your help!

@DannyDelve I am not sure if you are still looking for the solution. I found that this code in the slider change function will do it. `$(ui.handle).find('span').html('$' + ui.value); `