Not a Bug: Transition didn't apply to the front end

I encountered a bug with the transition.

I applied transition for a button class .btn-download. It works well in the editor when I hover over it, but it didn’t apply to the front end.

I’ve regenerated everything in the setting, but no luck. I don’t have any caching plugins enabled for the site.

Environment info

  • WordPress version: 6.0.3
  • Gutenberg Plugin version: -
  • Cwicly Plugin version: Version
  • Cwicly Theme version: 1.0.3

Hi @jornes,

Unfortunately, I don’t seem to be able to reproduce this issue on my end.

Could you detail a step by step reproduction or provide a screencast of the issue?

Thank you.

1 Like

It’s because you have scroll animations directly applied to your button(s) and some properties interfere with each other.
You could kind of fix/override things with relative styling, but there is too much involved, like transition duration, transition delay, transition property, etc. It wouldn’t make any sense.

Using animate on scroll, I’d suggest to add an additional container to your individual elements and apply the scroll animation to it instead of the actual element, to ensure they act as intended.

This is my general recommendation when using scroll animations. Always add a dedicated animation wrapper.


Hi @Marius

Ops…I forgot about that. It makes sense. Thank you!

Hi @Araminta, Marius said it right. I did it wrongly. So, it’s not a bug. Sorry!

1 Like