Sliding animation on the form

  • bibo1989
    Asked on March 22, 2015 at 3:49 AM

    Hi, how can I make a sliding form like this one:

    http://www.jotformpro.com/form/43514812962961

     

    Thanks

  • Jan
    Replied on March 22, 2015 at 10:12 AM

    Hello there,

    In order to use this kind of animation or transition, you need to add these custom CSS code on your form.

    .form-section {
    position : relative;
    left : 120%;

    /* 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;
    -webkit-animation : fadein 0.5s forwards;
    animation : slide 0.5s forwards;
    }

    @keyframes fadein {
    100% { left: 0; }
    }

    @-moz-keyframes fadein {
    100% { left: 0; }
    }

    @-webkit-keyframes fadein {
    100% { left: 0; }
    }

    Here's a  guide on how to inject custom CSS code. Hope this works. Let us know if you need any help.

    Thank you.