I-Firefox Community Forum

Hello, I made animations CSS on my web site and everything was working great on all browsers. I just see that it doesn't work anymore only in firefox...

here is my code:

/* -------------------------------------- */ /* ANIMATION ANE */ @keyframes mouvement-uniforme {

   0% 		{ animation-timing-function: linear; transform: translateX(-500px); }
   100% 	{ animation-timing-function: linear; transform: translateX(30px); }

}

@-webkit-keyframes webkit-mouvement-uniforme { 0% { -webkit-animation-timing-function: linear; -webkit-transform: translateX(30px ) translateY(-2px ) rotate(-2deg); } 2% { -webkit-animation-timing-function: linear; -webkit-transform: translateX(60px ) translateY(2px ) rotate(2deg); } 4% { -webkit-animation-timing-function: linear; -webkit-transform: translateX(90px ) translateY(-2px ) rotate(-2deg); } 6% { -webkit-animation-timing-function: linear; -webkit-transform: translateX(120px ) translateY(2px ) rotate(2deg); } 8% { -webkit-animation-timing-function: linear; -webkit-transform: translateX(150px ) translateY(-2px ) rotate(-2deg); } 10% { -webkit-animation-timing-function: linear; -webkit-transform: translateX(180px ) translateY(2px ) rotate(2deg); } 12% { -webkit-animation-timing-function: linear; -webkit-transform: translateX(210px ) translateY(0px ) rotate(-1deg); } 14% { -webkit-animation-timing-function: linear; -webkit-transform: translateX(240px ) translateY(1px ) rotate(1deg); } 18% { -webkit-animation-timing-function: linear; -webkit-transform: rotate(0deg) translateX(240px) translateY(2px ); } 24% { -webkit-animation-timing-function: linear; -webkit-transform: rotate(1deg) translateX(240px) translateY(-2px ); } 28% { -webkit-animation-timing-function: linear; -webkit-transform: rotate(0deg) translateX(240px) translateY(3px ); } 32% { -webkit-animation-timing-function: linear; -webkit-transform: rotate(0deg) translateX(240px) translateY(-1px ); } 34% { -webkit-animation-timing-function: linear; -webkit-transform: rotate(1deg) translateX(245px); } 36% { -webkit-animation-timing-function: linear; -webkit-transform: rotate(0deg) translateX(-2px); } 38% { -webkit-animation-timing-function: linear; -webkit-transform: translateX(-2px) translateY(2px ); } 40% { -webkit-animation-timing-function: linear; -webkit-transform: translateX(-245px); } 42% { -webkit-animation-timing-function: linear; -webkit-transform: translateX(-245px) rotate(1deg) translateY(-2px ); } 43% { -webkit-animation-timing-function: linear; -webkit-transform: translateX(-245px) rotate(-3deg); } 100% { -webkit-animation-timing-function: linear; -webkit-transform: translateX(0px); } }

@-moz-keyframes moz-mouvement-uniforme { 0% { -moz-transform: translateX(30px ) translateY(-2px ) rotate(-2deg); } 2% { -moz-transform: translateX(60px ) translateY(2px ) rotate(2deg); } 4% { -moz-transform: translateX(90px ) translateY(-2px ) rotate(-2deg); } 6% { -moz-transform: translateX(120px ) translateY(2px ) rotate(2deg); } 8% { -moz-transform: translateX(150px ) translateY(-2px ) rotate(-2deg); } 10% { -moz-transform: translateX(180px ) translateY(2px ) rotate(2deg); } 12% { -moz-transform: translateX(210px ) translateY(0px ) rotate(-1deg); } 14% { -moz-transform: translateX(240px ) translateY(1px ) rotate(1deg); } 18% { -moz-transform: rotate(0deg) translateX(240px) translateY(2px ); } 24% { -moz-transform: rotate(1deg) translateX(240px) translateY(-2px ); } 28% { -moz-transform: rotate(0deg) translateX(240px) translateY(3px ); } 32% { -moz-transform: rotate(0deg) translateX(240px) translateY(-1px ); } 34% { -moz-transform: rotate(1deg) translateX(245px); } 36% { -moz-transform: rotate(0deg) translateX(-2px); } 38% { -moz-transform: translateX(-2px) translateY(2px ); } 40% { -moz-transform: translateX(-245px); } 42% { -moz-transform: translateX(-245px) rotate(1deg) translateY(-2px ); } 43% { -moz-transform: translateX(-245px) rotate(-3deg); } 100% { -moz-transform: translateX(0px); } }

@-ms-keyframes ms-mouvement-uniforme {

   0% 		{ -ms-animation-timing-function: linear; -ms-transform: translateX(-500px); }
   100% 	{ -ms-animation-timing-function: linear; -ms-transform: translateX(0px); }

} @-o-keyframes o-mouvement-uniforme {

   0% 		{ -o-animation-timing-function: linear; -o-transform: translateX(-500px); }
   100% 	{ -o-animation-timing-function: linear; -o-transform: translateX(0px); }

}

.position { position: relative; top: -200px; left: -280px; float:left; }

.bouge { animation: mouvement-uniforme 60s ; -webkit-animation: webkit-mouvement-uniforme 20s ; -webkit-animation-iteration-count: infinite; -webkit-animation-fill-mode: forwards; -webkit-animation-duration: 15s; -webkit-animation-delay: 0s; -webkit-overflow-scrolling: auto!important;

-moz-animation: moz-mouvement-uniforme 20s; -moz-animation-iteration-count: infinite; -moz-animation-fill-mode: forwards; -moz-animation-duration: 15s; -moz-animation-delay: 0s;

-ms-animation: ms-mouvement-uniforme 10s ;

-o-animation: o-mouvement-uniforme 10s ; }

It was working fine before on firefox. it works on other browsers (opera, Edge,..) Do something changed? it's a long time that i didn't chek it so...

this is the page where a donkey should appear at the bottom of the page:

https://www.campingnoroc.com/en/our-campsite/

Thanks a lot for your help!!

Recently I used the forgot about this site for reddit, but when I try to click on a link from either my bookmarks or from a web search I keep on getting. [The page isn’t redirecting properly Firefox has detected that the server is redirecting the request for this address in a way that will never complete. This problem can sometimes be caused by disabling or refusing to accept cookies.]

Not exactly sure what causes this or how to fix it.

https://connect.mozilla.org/t5/user/ssoregistrationpage?dest_url=https:%2F%2Fconnect.mozilla.org%2F

link from a message to me in my email. Can't sign in . Keeps asking me to register and rejects my registered name. For the last couple years, intermittently.

When visiting some smaller and less known websites on my computer it shows the error message "connection has timed out" but on my laptop it loads just fine. Both run firefox and are sync'd with the same configuration and extensions. I already tried the troubleshoot mode and also checked the firewall. Is there anything else I can try to fix this?

When I copy text from other websites, I'm not able to paste in the text field of Whatsapp Web. I'm using Firefox Developer Edition Browser in my laptop. But when I copy text from Whatsapp Web itself, I am able to paste in the text field.

This issue started happening just a few days ago.

Here are my specifications:

Browser: Firefox Developer Edition 117.0b8 (64-bit)

OS: Pop!_OS 21.10

I frequently use GroupMe on desktop from Firefox, on two separate computers (a self-built desktop, and a Dell Latitude laptop).

Starting sometime over a week ago, I have been unable to drag & drop or otherwise upload photos in my chats. The only method that works is pasting direct URLs of JPGs.

In all other circumstances, I get the uploaded image error attached to this post.

Two different GroupMe support agents have said that, since image upload is still working in Edge, that it's a Firefox problem.

Tried clearing cache, site cookies, reset the browser, ran in troubleshooting mode...same result every time.

This is not the "image file size too big" error. I used to routinely post captures from the Snipping Tool, and I can't anymore.

I'm not sure where else to go to troubleshoot this. It's very annoying. Any suggestions?

I'm trying to use Microsoft Teams in Firefox because the native app for Linux is abandoned and crashes, and at first sight the app is blocking Firefox on purpose. Buttons to make calls are disabled, stating that audio and video are not supported in my browser, but everything works normally if join to existing calls using e.g. links.

Is it possible to trick Teams to think I'm using Chrome? I found the "User-Agent Switcher and Manager" add-on, but I can't figure out how to possibly use it.

In the last week or so, iPlayer, All4, and Spotify (that I know of) have stopped working in the Firefox browser. All4's error suggests DRM isn't enabled, the others just say try again. Roll20 hasn't been working for even longer (more like months). They work in Microsoft Edge and Chrome. Youtube is still working, as are video players in social media.

I have tried the following solutions:

• Firefox is up to date
• Windows is up to date
• Updated graphics drivers
• 'Widevine Content Decryption Module provided by Google Inc.' is set to 'Always Activated' and is up to date
• 'Play DRM-controlled' content is ticked in about:preferences
• Checked if anything changed if either of the above were turned off (it did not)
• media.eme.enabled is set to true in about:config
• Put Firefox in troubleshooting mode
• Turned off my addons (including uBlock Origin) manually
• Tried in a Private Browsing window
• Turned off Tracking Protection
• Restarted my laptop

Nothing has fixed the problem, or given me any more indication of what is wrong. I don't know how to a) fix or b) find the problem. All I can think is that it may be related to the recent changes to Chromium regarding ad-blockers? But no one else seems to be having the same problem so I doubt it.

I am unable to play DRM content on: Amazon, hulu, Netflix, Adult Swim, or youtube.

Any help? https://support.mozilla.org/en-US/kb/enable-drm?as=u&utm_source=inproduct

I have followed other articles besides this.

Vs 117.0, installed this morning, will not "continue to spotify", during the login process to the spotify desktop app. All had been working perfectly over the past few months until today. Was able to connect to spotify thru Chrome, but something get changed/broke in the new firefox v117.0 (64 bit), Win 10.

Since yesterday I can't access multiple websites like Spotify, Reddit, Google Drive etc on my desktop computer anymore. I don't know why and I didn't change anything over night. It also works fine in Microsoft Edge.

Reddit shows the "whoa there, pardner" error, spotify shows 403 error, Google Drive says my browser (Firefox 120.0) isn't supported and others are simply unavailable. At the same time Google looks off and Twitch is just a huge loading screen.

I cleared all the data (cookies/cache), but that didn't help.

I had this reddit error a few weeks ago already, but it disappeared on its own. However it was only reddit that was affected.

Hi everyone, When i go to the website config.office.com in firefox there is just a white screen. Nothing more. Instantly white. I have checked if this is an issue at the side of Microsoft but it doesn't look like it is. The website does load correctly in Microsoft Edge.

I tried the following in Firefox: - Firefox is up to date (Version 115.0.2 64 Bits) , I have had this issue in other versions of Firefox too. It's not a new issue in this newest version. - Tried disabling all the security features in Firefox, disabling all add-ons, and disabling the extra security for cookies - Starting firefox in safe mode (Shift click on firefox, then open the website) - Checked the Network inspector. All packets have status 200 (See the first screenshot)

You can check the second screenshot for the white page.

Some help is appreciated :) Thanks!

Twitter not working properly on Firefox (Volume on videos can't be changed, hovering over buttons doesn't do anything and font looks a bit off, could be just Firefox font or something) works on chrome and other browsers.

Video link that shows this of: https://youtu.be/3Lk83z-ozVI?si=uWYjGhFk294Hn9Dj

Hello, this is html code:

<div class="home-page-image-container">
  <img src="https://webdesignleren.com/wp-content/uploads/2023/07/auto-reparatie-in-hoogvliet.webp" alt="auto reparatie" />
  <div id="app"></div>
	  </div>

and this is Javascript code:
<script src="https://unpkg.com/typewriter-effect@latest/dist/core.js"></script>
<script>

var app = document.getElementById('app');

var typewriter = new Typewriter(app, {
    loop: true
});

typewriter.typeString('Home Developer')
    .pauseFor(2500)
    .deleteAll()
    .typeString('Web Designer')
    .pauseFor(2500)
    .deleteAll()
    .typeString('<strong>FrontEnd Developer</strong>')
    .pauseFor(2500)
    .start();

</script>

and this is CSS code:

#app{
  text-align:center;
  font-size:50px;
  background-image: linear-gradient(
    -225deg,
    #231557 0%,
    #44107a 29%,
    #ff1361 67%,
    #fff800 100%
  );
  background-clip:border-box;
   text-fill-color: transparent;
  background-clip:text;
  -webkit-background-clip:text;
  -webkit-text-fill-color: transparent;
  text-fill-color: transparent;
  animation: textclip 2s linear infinite;
}

@keyframes textclip {
  to {
    background-position: 200% center;
  }
}

the typewriter animation with text on chrome,edge,opera is working very wel . only on firefox is not working correctly. I see firefox has some problems with gradient.in this textwriter animation on firefox the first 3-4 letters are not showing and it has strange behaviour. I tried in this way to solve the problem:

 #app {
      text-align: center;
      font-size: 50px;
      white-space: nowrap;
      overflow: hidden;
    }

    #app::before {
      content: attr(data-text);
      display: inline-block;
      width: 0;
      color: #231557;
      animation: typewriter 4s steps(40) infinite, colorTransition 4s infinite;
    }

    @keyframes typewriter {
      from {
        width: 0;
      }
    }

    @keyframes colorTransition {
      0% {
        color: #231557;
      }
      50% {
        color: #ff1361;
      }
      100% {
        color: #ff1361;
      }
    }
 <div id="app" data-text="Hello, Gradient!"></div>

but it didn't helpt . I tried many ways but the problem is the same . can some one tell me how I can solve this problem with firefox . link text any idea is welkome it has to be some way to solve this problem . I used chatgpt but it didn't help. thanks johan

Hi, I updated Firefox to v119.0.1 and on Amazon Music site, the "navigation menu" is missing, see attached file. The "menu" is present on Edge (see bottom frame of Edge screen shot). What should I do to back the frame?

Best regards, Andrei

Here is a sample URL that works on Microsoft Edge (current version) and receives an error message on Firefox (115.0.2): https://www.t-mobile.com/home-internet The error received from the web site when using FF is:

Bad Request Your browser sent a request that this server could not understand. Size of a request header field exceeds server limit.

FF was working with all T-Mobile pages a few months ago and now fails with this same error on most pages.

To test on Edge, I pasted the identical address that failed in FF into Edge and it worked fine so I am confident I am comparing the same web page on the two browsers.

Thanks for your help. Claude