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 apply a transition time to the next question/page.

    Asked by miohonda on September 01, 2016 at 07:44 AM
    2) A smoother transition (applying a transition time?) to the next question/page.
  • Profile Image
    JotForm Support

    Answered by beril on September 01, 2016 at 07:56 AM

    If I understand your question correctly, you want to add a timer for every page. You can use our Global Countdown Widget.

    If you want to track how long someone has filled your form, you can use the following widgets:

    http://widgets.jotform.com/widget/timer

    http://widgets.jotform.com/widget/time_tracker

    http://widgets.jotform.com/widget/fancy_timer

     

    If this doesn't answer your question, please explain further and/or add more details about it so we can assist you properly.

  • Profile Image

    Answered by miohonda on September 01, 2016 at 09:15 PM

    Sorry my question was not clear.

    What I wanted was a smooth (fade out fade in) interaction to the next question.

    Can this be done?

  • Profile Image
    JotForm Support

    Answered by jonathan on September 01, 2016 at 11:52 PM

    Yes you can also add transition effect like fade out/in on your form fields. You will need to use specific CSS codes for such transition effects.

    Here is an example form that loads with transition effect https://form.jotformpro.com/form/42876779780981 A colleague had this solution came from here.

    Can you please confirm if transition effect is what you were looking for.

    It will also help us come up with a better suggestion if you share to us your form you want to apply the effects and describe more how you wanted it to happen. If you have example resource you can share to us it should help.

    Thanks.

  • Profile Image

    Answered by miohonda on September 02, 2016 at 12:28 AM

    Thanks! 

    Yes, that is exactly what I wanted.

    I copy & pasted the source code of the example you sent me. Although it seems to be working, can you take a look and see if I haven't added anything unnecessary? I want to keep the code as clean as possible.

    https://form.jotform.me/62449047771462

  • Profile Image
    JotForm Support

    Answered by beril on September 02, 2016 at 03:22 AM

    When I've checked your form I didn't see the CSS code that my colleague was provided. Did you paste the CSS code below:

    .form-section {

        -webkit-animation : fadein 2s;

        /* Safari, Chrome and Opera > 12.1 */

           -moz-animation : fadein 2s;

        /* Firefox <

        16 */

            -ms-animation : fadein 2s;

        /* Internet Explorer */

             -o-animation : fadein 2s;

        /* Opera <

        12.1 */

                animation : fadein 2s;

    }

     

    @keyframes fadein {

        from { opacity: 0; }

        to   { opacity: 1; }

    }

     

    @-moz-keyframes fadein {

        from { opacity: 0; }

        to   { opacity: 1; }

    }

     

    @-webkit-keyframes fadein {

        from { opacity: 0; }

        to   { opacity: 1; }

    }

     

    @-ms-keyframes fadein {

        from { opacity: 0; }

        to   { opacity: 1; }

    }

     

    @-o-keyframes fadein {

        from { opacity: 0; }

        to   { opacity: 1; }

    }

     

    If you have any question or issues, please do not hesitate contacting us. We will be glad to assist you.

  • Profile Image

    Answered by miohonda on September 02, 2016 at 04:00 AM

    This is strange.

    I injected the code here but it seemed to have disappeared.. But the transition seems to be working. Why is this happening..?

  • Profile Image
    JotForm Support

    Answered by ashwin_d on September 02, 2016 at 05:18 AM

    Hello miohonda,

    I also did check your form and I was not able to see the injected custom css code which was shared by my colleague. I have gone ahead and injected the css code again. I would suggest you to please check your form again and see if you are able to see the injected css code.

    Thank you!