• 1

Read this first!

We do not monitor these forums. The forum is provided to exchange information and experience with other users ONLY. Forum responses are not guaranteed.

However, please submit a ticket if you have an active subscription and wish to receive support. Our ticketing system is the only way of getting in touch with RSJoomla! and receiving the official RSJoomla! Customer Support.

For more information, the Support Policy is located here.

Thank you!

TOPIC: Conditional field transitions.

Conditional field transitions. 11 years 1 month ago #26929

  • ssfreedom
  • ssfreedom's Avatar
  • OFFLINE
  • Fresh Boarder
  • Posts: 5
  • Thank you received: 1
Does anyone have insight into putting a transition animation on the appearance of conditional fields? By default, you click an option that makes a conditional field appear...and it just APPEARS! I would like to soften it up by having it fade/easein/or whatever...

I would prefer to stay CSS only - but not sure if that's possible.

Any thoughts?
The administrator has disabled public write access.
The following user(s) said Thank You: matthias.bartels

Conditional field transitions. 5 years 10 months ago #39190

  • paypal343
  • paypal343's Avatar
  • OFFLINE
  • Fresh Boarder
  • Posts: 1
  • Thank you received: 1
Hi there,

I am aware that the post is over 5 years old but maybe someone finds this useful. I've solved it as follows:

Add the following CSS code to the custom CSS section of the form:
.rsform-block {
   -webkit-animation: fadein 1.5s; /* Safari, Chrome and Opera > 12.1 */
       -moz-animation: fadein 1.5s; /* Firefox < 16 */
        -ms-animation: fadein 1.5s; /* Internet Explorer */
         -o-animation: fadein 1.5s; /* Opera < 12.1 */
            animation: fadein 1.5s;
}
 
@keyframes fadein {
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-moz-keyframes fadein { /* Firefox */
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-webkit-keyframes fadein { /* Safari and Chrome */
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-o-keyframes fadein { /* Opera */
    from {
        opacity:0;
    }
    to {
        opacity: 1;
    }
}
The administrator has disabled public write access.
The following user(s) said Thank You: danpoole
  • 1

Read this first!

We do not monitor these forums. The forum is provided to exchange information and experience with other users ONLY. Forum responses are not guaranteed.

However, please submit a ticket if you have an active subscription and wish to receive support. Our ticketing system is the only way of getting in touch with RSJoomla! and receiving the official RSJoomla! Customer Support.

For more information, the Support Policy is located here.

Thank you!