Animations (CSS) in Firefox not working


Topic: Animations (CSS) in Firefox not working

m.Eckstein pro asked 5 years ago

Hello there, I try to implement some animations in my web projects and I wondered why I was not successful in getting them to work. I'm developing with firefox.

When I open my project with Edge, all animations work.

When I open the mdbootstrap.com- tutorials or sites with Edge, I can see all animations working fine. When I open it with Firefox, animations are not working on mdbootstrap.com, too. I tried with three PC (everytime Windows 10 64bit + Firefox latest Version 64 bit), all with the same result.

I can't find a mistake - has anybody the same problem?

Thank you very much!

Michael


m.Eckstein pro commented 5 years ago

I tried to animate with CSS / class "animated" like that:

class="animiated fadeIn slower"


Marta Szymanska staff pro premium answered 5 years ago

Hi,

I see all examples of animations work in our documentation here: https://mdbootstrap.com/docs/jquery/css/animations/. My version of FF is 66.0.3 (64-bit) for Ubuntu. Would you create a snippet showing the problem here: https://mdbootstrap.com/snippets/ or provide any other example with code to let me check your code? I'll try to help you.

Best, Marta


m.Eckstein pro answered 5 years ago

Hi Marta,

thanks a lot for your answer. Knowing that Firefox does not seem to have a problem with the animations in General was important for me.

You have to know that I am developing on Virtual Machines (Win10 / several Browsers including Firefox in the newest Version).

Reinstalling Firefox didn't help - while Edge, Internet-Explorer and Chrome display the animations in a correct way, Firefox did not.

But at least, I found the problem in the combination of Firefox and the RDP - Protocol (All RDP-Options for best display quality are activated of course). I installed Firefox on my local PC and all animations are displayed correct. In a RDP - Session they are missing. When I connect to my VM via VNC-protocol, the animations are displayed correct.

So, the Problem is solved for me and maybe my hint is useful for other users developing in VM. I do not really understand, why IE, Edge or Chrome display all animations correct with RDP-Connection and only Firefox not. But I think this is a problem for Microsoft or Mozilla ;-)

Thank you very much!

Michael


Marta Szymanska staff pro premium commented 5 years ago

Hi,

thank you for your extensive commentary. I think it can be helpful for other users as you said.

Best, Marta


Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

Specification of the issue
  • User: Pro
  • Premium support: No
  • Technology: MDB jQuery
  • MDB Version: 4.7.7
  • Device: PC
  • Browser: Firefox 66.0.3 (64-Bit)
  • OS: Windows 10
  • Provided sample code: No
  • Provided link: No