What is JotForm?
JotForm is a free online form builder which helps you create online forms without writing a single line of code. No sign-up required.

At JotForm, we want to make sure that you’re getting the online form builder help that you need. Our friendly customer support team is available 24/7.

We believe that if one user has a question, there could be more users who may have the same question. This is why many of our support forum threads are public and available to be searched and viewed. If you’d like help immediately, feel free to search for a similar question, or submit your question or concern.


  • Profile Image

    Is it possible to hide the slider values?

    Asked by emilykcook on January 17, 2013 at 04:44 PM

    I would like the slider to just be the bar with the slider label next to it, and not show the min, max, and current values underneath. Is this possible? Thanks!

  • Profile Image
    JotForm Support

    Answered by Deygus on January 17, 2013 at 05:32 PM

    Hello, unfortunately there's no way to do this within the builder but you can however still remove it using the form's source code and just erase the line of code containing the numbers and then just embed that onto your website.

    You will need to remove this line of code:

    <tr><td align="center" width="20" style="font-family: Verdana; font-size: 9px;">0</td><td align="center" width="160" style="font-weight: bold; font-family: Verdana; font-size: 9px;">5</td><td align="center" width="20" style="font-family: Verdana; font-size: 9px;">10</td></tr>

    I hope this helps and if you have any other questions or problems don't hesitate to ask us.

  • Profile Image

    Answered by emilykcook on January 18, 2013 at 11:43 AM

    Thank you for the quick reply. I looked at the source code and couldn't seem to find that line of code within it. Could you give me a bit more direction as to where it is located?

    Here is a link to my form if that helps: http://www.jotform.com/?formID=30159551225146

    Thanks again!

  • Profile Image
    JotForm Support

    Answered by Deygus on January 18, 2013 at 12:42 PM

    Hello, that is my fault as that line of code was part of the element itself which is not displayed in the full source so I do apologize about that. If you don't mind I will need a little bit more time to look into this if that is okay with you and as soon as myself or one of my colleagues figures this out we will get back to you on this thread with a possible solution.

  • Profile Image
    JotForm Support

    Answered by Deygus on January 18, 2013 at 01:36 PM

    Okay so one of my Colleagues and I put our heads together on this one and we think that we may have found a possible solution so please let us know if this works and does what you requested. We ended up having to use your form's source elements to create a customized CSS Code to point to your sliders and remove the numbers.

    You will need to inject this css code into your form -

    #cid_1 >table >tbody >tr +tr{display:none;!important}

    #cid_3 >table >tbody >tr +tr{display:none;!important}

    #cid_4 >table >tbody >tr +tr{display:none;!important}

     

    You can see a demo of this working on a cloned version of your form here: 

    http://form.jotform.us/form/30175261481146

     

  • Profile Image

    Answered by emilykcook on January 18, 2013 at 03:06 PM

    it worked! thank you very much :)

  • Profile Image
    JotForm Support

    Answered by Deygus on January 18, 2013 at 03:15 PM

    You are very welcome and I am glad to hear that it worked for you! If you need help with anything else just let us know.

  • Profile Image

    Answered by emilykcook on January 20, 2013 at 10:27 AM

    Hi again!

    I was wondering if you would mind helping me with two more related questions:

    1. Can I hide the slider label as well?

    2. Is it possible to change the width of the slider itself? If I wanted it to be, say, 300px wide?

    Thank you!

  • Profile Image

    Answered by moonzkie on January 20, 2013 at 01:31 PM

    Hi,

    Yes, this is possible by injecting these CSS codes in your form.

    #label_1 {display:none;!important}

    #label_3 {display:none;!important}

    #label_4 {display:none;!important}

    To change the slider width, click the slider you want to make changes to then select Width. You can then change the width accordingly.

    Thank you.

  • Profile Image

    Answered by lastangel on January 21, 2013 at 02:23 PM

    Hello,

    I don't know anything about coding but I tried to paste the code you gave in my form, adding more lines because I have more questions and it worked. The problem is that I would like to keep 0 and 100 and cancel the middle number. Can you suggest me the code?

    formID=23317174896361

     

    Thanks

  • Profile Image
    JotForm Support

    Answered by Welvin on January 21, 2013 at 03:34 PM

    Please try this codes:

    td +td  {

    visibility: hidden;

    }

    td +td + td  {

    visibility: visible !important;

    }

    Same Guide: How to Inject Custom CSS Codes

     

    Thanks

  • Profile Image

    Answered by lastangel on January 21, 2013 at 03:37 PM

    Super!!!

  • Profile Image

    Answered by lastangel on January 29, 2013 at 05:00 PM

    Same form, one last question:

    If you go to my form you'll see I have, for each question, labels:

    0= ....

    100= ...

    Best thing would be to put 0= on the left side  of the slider and 100= on the right side of the slider. In psychometry this is the way you can get the best possible results from the audience.

    Finally, but not so important, best sliders shoud have arrow-like ends (both right and left).

     

    Do you think you can solve one of the issues?

     

    Thanks

  • Profile Image
    JotForm Support

    Answered by Deygus on January 29, 2013 at 06:18 PM

    Just for clarification purposes, did you mean something like this? Or?

     

  • Profile Image

    Answered by lastangel on February 04, 2013 at 11:28 AM

    That could be a part of the solution. The other thing would be positioning of the captions of the scores. If you check my form, even if it is in italian, you'll see what I mean with

    0= ....

    100= ...

    Best thing would be to put 0= on the left side  of the slider and 100= on the right side of the slider. In psychometry this is the way you can get the best possible results from the audience.

  • Profile Image
    JotForm Support

    Answered by Welvin on February 04, 2013 at 01:18 PM

    Hi,

    I think that is too complicated to do. It will require to download the refind version of the form with separate CSS and JS files. Then from the JS Files, find the slider settings and reposition them as per mention settings then upload it to your own server before embedding the form source codes. The JS Files are too big, I currently don't know which JS files the slider resides. 

     

    Thanks