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

    How to disable field highlighting effect?

    Asked by georgeb on December 20, 2013 at 11:45 AM

    How can I use the same color as the background image?

    I imputed the css coding as shown above and it isnt doing anything.



    This is a re-post of a comment on Customize Your Form Using Custom CSS Codes

    background image shown same and
  • Profile Image
    JotForm Support

    Answered by Welvin on December 20, 2013 at 01:17 PM

    Hi,

    What you mean is how you can add a background image to your form? Or, do you mean how you can change the color i.e. the font color of the form to match with your background image? Let us know.

    Also, we need the form URL so we can check and help you add the custom codes.

    Thanks

  • Profile Image

    Answered by georgeb on December 20, 2013 at 02:45 PM

    This is the form: http://form.jotform.co/form/33534061109850

     

    I am talk about how it changes color when you go to input the information.  How can I prevent that from happening?

  • Profile Image
    JotForm Support

    Answered by ardy0689 on December 20, 2013 at 03:49 PM

    Thanks for giving us your form URL. From what I can understand on your inquiry, are you talking about making the form required background color to be transparent and see your background image?

     

    That only happens if you left them blank. It is due to the fact that you enabled the "Required" and it is turned on for these fields.

     

    If you like to make the red color warning to be transparent, you may use this Custom CSS Code:

    .form-line-error
    {
    background:transparent !important;
    }

    li.form-line-error
    {
    color:white !important;
    }

    Please refer to this user guide How to Inject Custom CSS Codes.

    This is a sample form that you can test.  Please let us know if this is the one you want. Thank you

  • Profile Image

    Answered by georgeb on December 20, 2013 at 05:37 PM

    Thank you for the reply.  Unfortunately, that isnt what I am referring to. 

     

    What I was referring to, is when you go to enter in the "name" and "email" it changes those sections to a yellowish color like a "highlight"

  • Profile Image

    Answered by jedcadorna on December 20, 2013 at 05:44 PM

    @georgeb,

    You can inject this code to remove the yellow highlight when the field is active.

    .form-line-active{

    background:none;

    }

  • Profile Image
    JotForm Support

    Answered by ardy0689 on December 20, 2013 at 05:59 PM

    I apologize for the confusion. In addiition to what my colleague has given you should also insert this CSS code as native browsers such as Safari(Blue) and Chrome(Yellow) enforce a highlight on form input fields.

    input:focus,
    select:focus,
    textarea:focus,
    button:focus {
        outline: none !important;
    }

    Please refer to this user guide How to Inject Custom CSS Codes. If you need further assistance, please do not hesitate to ask. Thank you

  • Profile Image

    Answered by georgeb on December 20, 2013 at 10:20 PM

    I input both sets of coding, but it is still doing it?

  • Profile Image
    JotForm Support

    Answered by Welvin on December 21, 2013 at 10:39 AM

    I do see the changes to the form now, the highlighting effect is already removed. I'd suggest clearing your browsers cache to fully refresh the entire page.

    And by the way, aside from injecting a custom CSS codes to the form, you can disable the field highlighting effect from the form settings:

    Setup & Embed > Preferences > Field Styles > Highlight Effect:

    Thanks