Reply To: Can I use a different transition when hiding/showing conditional fields?

• pax

• September 7, 2019 at 12:29 am

I think I found a way:
override the display: [ none | block ] with opacity: [ 0 | 1 ] + height: [ 0 | auto ]

.acf-field {
  transition: all .5s ease-in 0s;
}

#acf-form .acf-field.acf-hidden {
  display: block !important;
  opacity: 0;
  height: 0;
}

#acf-form .acf-field:not(.acf-hidden) {
  opacity: 1;
  height: auto;
}

_________
Inspired by this and this (as partial answers)
Note: I just figured this out, I’m not yet sure if there are any downsides to it.