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 add a rollover submit button to a form

    Asked by MHFF on May 04, 2011 at 04:54 AM

    By rollover action i meanthe curser doesn't change / behave as though it's over a hyperlink.

    Also, is there a way to add your own button image with rollover (i.e. colour change, etc)?

    Thanks

    hover button roll-over creating forms rollover button rollover image rollover
  • Profile Image
    JotForm Support

    Answered by NeilVicente on May 04, 2011 at 08:11 PM

    Hi,

    Unfortunately, a rollover button is not explicitly possible with Jotform. You would have to use custom css in order to achieve this.

    Take a look at this Example Form with Rollover Buttons

    These are the css codes that made that possible:

    .form-submit-button{
    border:none;
    background-color:lightgray ;
    border: 1px solid gray;
    height: 38px;
    width: 148px;
    }
    .form-submit-button:hover {
    background-color: white;
    }


    .form-submit-reset{
    background-image:url(
    https://cms.jotform.com/uploads/image_upload/image_upload/global/1295_Buttons_05.png);
    border: medium none;
    height: 38px;
    width: 148px;
    }
    .form-submit-reset:hover {
    background-image:url(
    https://cms.jotform.com/uploads/image_upload/image_upload/global/1293_Buttons_03.jpg);
    }

    Feel free to use and modify those codes to suit your needs. Click here to learn how to inject custom css to your form.

    For more information about CSS styling, visit this page.

     

    Hope you find this post useful. Let us know if there's anything else we can help you with.


    Neil

  • Profile Image

    Answered by propertymsd on October 27, 2011 at 08:06 PM

    Thanks!