Showing questions tagged: Show all questions

print settings - edit header and footer

hi, i'm using FF (version 98 at the moment) to print local files. It is key to me to edit header and footer for each print! the only solution i found so far to edit them … (read more)

hi,

i'm using FF (version 98 at the moment) to print local files. It is key to me to edit header and footer for each print! the only solution i found so far to edit them at all, is to go to about:config and for example search for print.print_headerleft. Besides that is not usable at all, it simply doesn't work! The header and footer remain the same. Please tell me how can i change header and footer?

If you delete the, in my opinion much better "page setup", why don't you include all it's funktions in the new print dialog?

another problem is the size of the new print preview! it's much to small! make it resizeable please.

Or just give us back the "page setup". That would be a big advantage over chrome and edge, which suffer the same printing problems.

Thanks

Asked by forinves 1 month ago

Last reply by forinves 1 hour ago

Firefox site call is redirected to scam site

Following site is immediately hijacked to a scam site asking for login apparently to access private info. It happens with Firefox (only) whenever security setups are set … (read more)

Following site is immediately hijacked to a scam site asking for login apparently to access private info. It happens with Firefox (only) whenever security setups are set "not to track", "not to prompt for passwords", "not to prompt for credit cards" "no history" "reset of cookies at logout" etc.. then the site below: http://thaimassage-herborn.de/ is redirected to SCAM SITE: https://xb7.serverdomain.org/admin/index.php appearing as "Adminpanel" asking for Login etc..

At the same time following site is partially blocked on the news banner pictures, with a white sheet over them, whenever down scroll is hit. https://www.tgrthaber.com.tr/

Only by resetting firefox deals with the issues. But ofcourse with the reason, above security settings removed.

Virusscanner was not able to detect this hijacking or the reason behind.

Is this a firefox software issue? Is there a way to resolve this? Thank you already for any support or suggestions to resolve.

Asked by taskin.sakarya 20 hours ago

Last reply by taskin.sakarya 1 hour ago

Windows folder shown in Group-By when opened from Firefox

Hi All I disabled the group-by option everywhere in my Win 11 home. Now I can open any folder and avoid that useless feature... except if I open the download folder from … (read more)

Hi All

I disabled the group-by option everywhere in my Win 11 home. Now I can open any folder and avoid that useless feature... except if I open the download folder from Firefox.

Details: - if I open my Downloads folder from the desktop shortcut I get it normal (no group-by) - if I click the folder icon close to the downloaded file in Firefox Library/Downloads window, then the windows folder is shown with Group-by enabled - the same happens if I click the folder icon close to the downloaded file in Firefox's download toolbar icon

Does this happen to others? Thank you Stefano

Asked by steluci 3 hours ago

Tabs are disappearing

My tabs keep disappearing. I have multiple tabs open but some of them just disappear for no apparent reason and I can't bring them back. I'm not in full screen mode and n… (read more)

My tabs keep disappearing. I have multiple tabs open but some of them just disappear for no apparent reason and I can't bring them back. I'm not in full screen mode and not toggling with the F11 key. Firefox is up to date and I've tried restarting my laptop.

Asked by mrsyardbroom 6 days ago

Last reply by mrsyardbroom 12 hours ago

firefox v.100 does not open links from thunderbird

it happens after upgarde to v.100 every click in the link in thunderbird starts only new empty FF window instead of the link content in a new tab This is not on the thun… (read more)

it happens after upgarde to v.100 every click in the link in thunderbird starts only new empty FF window instead of the link content in a new tab This is not on the thunderbird side, as when I set Chromium as default browser the link is opened correctly.

Asked by sebqas 1 week ago

Last reply by sebqas 1 day ago

WHY do ALL "printscreens" come out black (until after new power-cycle) immediately after using ANY "private browser"?

Find the "switch" that gets "activated" (when using ANY private browser window) that prevents us from using "printscreen" AND...ALL other "printsreen apps" as well (such … (read more)

Find the "switch" that gets "activated" (when using ANY private browser window) that prevents us from using "printscreen" AND...ALL other "printsreen apps" as well (such as "windows snipping tool"). After using ANY private browser, Printscreen just shows an all black screen! Once you've used a private browser window (on a Win 7 desktop)...you no longer have any printscreen ability until after you power-cycle...when it's too late!! Printscreen ALWAYS shows an all black screen!

Try it for yourself on YOUR desktop...regardless of your system!


AARRGGHH!! >:-(

Asked by danemer 1 day ago

Generic filename pasting images from clipboard

Hi Windows 10 21h2 Firefox 100.0 When pasting images from the clipboard into a website (atlassian confluence for example) firefox uses a generic image name (grafik.png) i… (read more)

Hi Windows 10 21h2 Firefox 100.0 When pasting images from the clipboard into a website (atlassian confluence for example) firefox uses a generic image name (grafik.png) instead of the actual filename. This started to happend a few weeks ago. I was not able to find a demo page where this can be tested, other browsers don't have this issue.

Anyone having similiar issues or an idea how to fix it?

Thanks

Asked by atc22 1 day ago

Ctrl+R

I'm uploading changed webpages to the internet on a daily basis, using Firefox. I'm Using Firefox version 100.0 now and I have discoverd a problem with version 100.0 . Fr… (read more)

I'm uploading changed webpages to the internet on a daily basis, using Firefox. I'm Using Firefox version 100.0 now and I have discoverd a problem with version 100.0 . From Firefox version 99.01 and downwards, this problem never existed before. The refresh button in Firefox 100.0 ( Ctrl+R ) no longer works good anymore! Sometimes it works good, the other time it's not working correct anymore, you will not see the latest uploaded webpage on the internet. The only solution to this problem is bij closing Firefox and restarting it. Only then you will see the latest uploaded webpage on the internet. Please have a serious look at this annoying problem in version 100.0. This problem can only be discoverd by people who are uploading new webpages to the internet, not bij the regular internet-users/visitors.

Asked by webmaster101 2 days ago

Last reply by webmaster101 2 days ago

Uncaught SyntaxError: expected expression, got '<'

We have a full stack "MEAN"(CosmosDb/mongoDB, Nodejs, Express and Angular 12) project hosted on Microsoft Azure. Somehow today I tried to log into the app with my favorit… (read more)

We have a full stack "MEAN"(CosmosDb/mongoDB, Nodejs, Express and Angular 12) project hosted on Microsoft Azure. Somehow today I tried to log into the app with my favorite browser Firefox and got stuck. Looked at the developer console and saw a bunch of exceptions. I tried our app running on various browsers: Chrome, Opera, Edge, Brave. They all work fine. Furthermore my local server also works with Firebox browser. What could be my issue? Please help.

Thanks so much!

Regards, Simon Web Development Leads

For checking: Our app url: https://reactiv-stage.azurewebsites.net usr/pwd: firefox/Test1234

Exception stack: Uncaught SyntaxError: expected expression, got '<' 944-es2015.f3df909392cc66c28462.js:1 ERROR Error: Uncaught (in promise): ChunkLoadError: Loading chunk 944 failed. (missing: https://reactiv-stage.azurewebsites.net/944-es2015.f3df909392cc66c28462.js) n.f.j@https://reactiv-stage.azurewebsites.net/runtime-es2015.4ce74e2f04c7193e849c.js:1:2878 n.e/<@https://reactiv-stage.azurewebsites.net/runtime-es2015.4ce74e2f04c7193e849c.js:1:886 n.e@https://reactiv-stage.azurewebsites.net/runtime-es2015.4ce74e2f04c7193e849c.js:1:852 loadChildren@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:1915005 loadModuleFactory@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:937911 load@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:937519 getChildConfig/<@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:930031 _tryNext@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:1765367 _next@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:1765285 next@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:1744982 i/<@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:1776818 _trySubscribe@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:1741063 subscribe@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:1740871 call@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:1765023 subscribe@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:1740749 call@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:1765023 subscribe@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:1740749 call@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:1759671 subscribe@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:1740749 l@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:1750180 _innerSub@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:1765539 _tryNext@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:1765446 _next@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:1765285 next@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:1744982 i/<@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:1776818 _trySubscribe@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:1741063 subscribe@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:1740871 call@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:1765023 subscribe@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:1740749 call@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:1763270 subscribe@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:1740749 call@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:1768690 subscribe@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:1740749 call@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:900653 subscribe@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:1740749 call@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:1759671 subscribe@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:1740749 call@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:1764181 subscribe@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:1740749 l@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:1750180 _innerSub@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:1765539 _tryNext@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:1765446 _next@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:1765285 next@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:1744982 i/<@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:1776818 _trySubscribe@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:1741063 subscribe@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:1740871 call@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:1765023 subscribe@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:1740749 call@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:899488 subscribe@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:1740749 call@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:900149 subscribe@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:1740749 call@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:900653 subscribe@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:1740749 call@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:1764181 subscribe@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:1740749 call@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:1764181 subscribe@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:1740749 call@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:1759671 subscribe@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:1740749 call@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:1764181 subscribe@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:1740749 l@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:1750180 _innerSub@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:1768116 _next@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:1767958 next@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:1744982 notifyNext@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:1768434 _next@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:1749848 next@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:1744982 c/</</<@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:1776187 invoke@https://reactiv-stage.azurewebsites.net/polyfills-es2015.2091e870b19d658a9f50.js:1:6542 onInvoke@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:314487 invoke@https://reactiv-stage.azurewebsites.net/polyfills-es2015.2091e870b19d658a9f50.js:1:6482 run@https://reactiv-stage.azurewebsites.net/polyfills-es2015.2091e870b19d658a9f50.js:1:1941 P/<@https://reactiv-stage.azurewebsites.net/polyfills-es2015.2091e870b19d658a9f50.js:1:16629 invokeTask@https://reactiv-stage.azurewebsites.net/polyfills-es2015.2091e870b19d658a9f50.js:1:7160 onInvokeTask@https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1:314303 invokeTask@https://reactiv-stage.azurewebsites.net/polyfills-es2015.2091e870b19d658a9f50.js:1:7081 runTask@https://reactiv-stage.azurewebsites.net/polyfills-es2015.2091e870b19d658a9f50.js:1:2556 m@https://reactiv-stage.azurewebsites.net/polyfills-es2015.2091e870b19d658a9f50.js:1:9154 invokeTask@https://reactiv-stage.azurewebsites.net/polyfills-es2015.2091e870b19d658a9f50.js:1:8239 _@https://reactiv-stage.azurewebsites.net/polyfills-es2015.2091e870b19d658a9f50.js:1:20027 k@https://reactiv-stage.azurewebsites.net/polyfills-es2015.2091e870b19d658a9f50.js:1:20349 <pre> Z https://reactiv-stage.azurewebsites.net/polyfills-es2015.2091e870b19d658a9f50.js:1 Z https://reactiv-stage.azurewebsites.net/polyfills-es2015.2091e870b19d658a9f50.js:1 P https://reactiv-stage.azurewebsites.net/polyfills-es2015.2091e870b19d658a9f50.js:1 invokeTask https://reactiv-stage.azurewebsites.net/polyfills-es2015.2091e870b19d658a9f50.js:1 onInvokeTask https://reactiv-stage.azurewebsites.net/main-es2015.c2b0cbbb8862de0e3042.js:1 invokeTask https://reactiv-stage.azurewebsites.net/polyfills-es2015.2091e870b19d658a9f50.js:1 runTask https://reactiv-stage.azurewebsites.net/polyfills-es2015.2091e870b19d658a9f50.js:1 m https://reactiv-stage.azurewebsites.net/polyfills-es2015.2091e870b19d658a9f50.js:1 invokeTask https://reactiv-stage.azurewebsites.net/polyfills-es2015.2091e870b19d658a9f50.js:1 _ https://reactiv-stage.azurewebsites.net/polyfills-es2015.2091e870b19d658a9f50.js:1 k https://reactiv-stage.azurewebsites.net/polyfills-es2015.2091e870b19d658a9f50.js:1

Asked by Simon Li 2 days ago

Last reply by Simon Li 2 days ago

amazon Doesn't display or function once logged in on Firefox

Seems like after installing the latest update Firefox will not allow Amazon to function or display properly after signing in to Amazon. I can sign in using any other brow… (read more)

Seems like after installing the latest update Firefox will not allow Amazon to function or display properly after signing in to Amazon. I can sign in using any other browser with no issue. When I sign in on Firefox the screen goes greyed out with no functionality capable. Nothing can be selected and in the background the display won't load correctly.

Asked by Ugly1 2 days ago

Last reply by Ugly1 2 days ago

Amazon prime videos stopped playing

Last night I was watching a video series on Amazon and the last episode won't play on my MacBook Pro. I plays on the TV and in Safari. I deleted and reloaded Firefox bu… (read more)

Last night I was watching a video series on Amazon and the last episode won't play on my MacBook Pro. I plays on the TV and in Safari. I deleted and reloaded Firefox but the issue remains.

Asked by Cheechako 3 days ago

Always Open Similar Files = Not applicable individually.

https://support.mozilla.org/en-US/kb/change-firefox-behavior-when-open-file ver 100.0 (64-bit) kor win10 64bit home kor ver 10.0.19044.1706 Selections do not work indivi… (read more)

https://support.mozilla.org/en-US/kb/change-firefox-behavior-when-open-file ver 100.0 (64-bit) kor win10 64bit home kor ver 10.0.19044.1706

Selections do not work individually depending on the download file Always Open Similar Files (When I activate the check,) Open all files. I hope it works differently for each individual file. .torrent .zip

I want to save the zip file(I don't want to open the file right away.) I want to open torrent file automatically. (Checking settings automatically works well) I'm not talking about torrent magnet.

I suggest you open it individually. Thank you. It's a function that doesn't exist locally.

And to give you another suggestion, I would like to be able to register the extensions manually for Applications. There are times when Firefox doesn't detect it. The user If there's a file called zip, I wish I could save the zip file and enter it. Manual input function.

Asked by 동우 3 days ago

Browser flag to run extensions on Chrome:// pages

Im trying to make a advanced theme. Im at the point where CSS Combinators are not going to work for what I want to accomplish. My next step is running a js script through… (read more)

Im trying to make a advanced theme. Im at the point where CSS Combinators are not going to work for what I want to accomplish. My next step is running a js script through tampermonkey on chrome://browser/content/browser.xhtml However I cant run extensions on Chrome:// pages I know Google Chrome has a flag to do this and was wondering if Firefox has one too. I know this causes security issues but I want to do it anyway

Asked by thenry.he 3 days ago

Last reply by thenry.he 3 days ago

Typing a comment in Facebook causes Firefox 100 to scroll up (the text moves down the page and out of sight)

This is a maddening bug! I know it started with the recent update to Firefox 100 because the behavior only started AFTER updating and I did not change ANY settings in Wi… (read more)

This is a maddening bug! I know it started with the recent update to Firefox 100 because the behavior only started AFTER updating and I did not change ANY settings in Windows 10, let alone any related to the keyboard. Please fix this bug!!

I double-checked this setting for Backspace key navigation. Here's what I did:

(1) In a new tab, type or paste about:config in the address bar and press Enter/Return. Click the button accepting the risk.

(2) In the search box in the page, type or paste browser.backspace_action and pause while the list is filtered

When I did this I saw the value was set to 2 (do nothing) so something else is causing this bug!

Asked by netrek 5 days ago

Last reply by netrek 4 days ago

Firefox loading issues whenm using webcam in Discord

I'm not sure where the issue is coming from but I've checked my Webcam settings and they're fine as far as I can tell. Whenever I have Discord open and am using my webcam… (read more)

I'm not sure where the issue is coming from but I've checked my Webcam settings and they're fine as far as I can tell. Whenever I have Discord open and am using my webcam and then open Firefox nothing will load and everything slows down. Could there be a firefox setting I can change?

Asked by Emma 4 days ago

Why my code work fine on chrome but not firefox?

Here is my code: <html> <head> <meta charset="utf-8"> <style> .fullCard, .lowerHalfCard, .upperHalfCard, .fullCard-after, .lo… (read more)

Here is my code:

<html>
	<head>
		<meta charset="utf-8">
		<style>
			.fullCard,
			.lowerHalfCard,
			.upperHalfCard,
			.fullCard-after,
			.lowerHalfCard-after,
			.upperHalfCard-after {
			  background-color: inherit;
			  border-radius: 10px;
			  height: 100%;
			  width: 100%;
			  position: absolute;
			  
			  align-items: center;
			  display: flex;
			  justify-content: center;
			  vertical-align:middle;
			}
		
			.fullCard-after::after,
			.upperHalfCard-after::after{
			  content: "";
			  display: block;
			  position: absolute;
			  height: 4px;
			  background-color: inherit;
			  width: 100%;
			  top: calc(50% - 2px);
			}
			.lowerHalfCard-after::after{
			  content: "";
			  display: block;
			  position: absolute;
			  height: 4px;
			  background-color: inherit;
			  width: 100%;
			  top: calc(50% - 2px);
			}
			.lowerHalfCard,
			.lowerHalfCard-after{
				clip-path: polygon(0% 50%, 100% 50%, 100% 100%, 0% 100%);
			}
			.upperHalfCard,
			.upperHalfCard-after{
			  clip-path: polygon(0% 0%, 100% 0%, 100% 50%, 0% 50%);
			}

			.splitFlap {
			  background-color:black;
			  box-sizing: border-box;
			  border-radius: 10px;				
			  width: 100px;
			  height: 150px;
			  position: relative;			 
			}

			.rotate0to90 {
			  animation-name: r0to90;
			}

			.rotate90to0 {
			  animation-name: r90to0;
			}

			.rotate0to_90 {
			  animation-name: r0to_90;
			}

			.rotate_90to0 {
			  animation-name: r_90to0;
			}

			.rotate0to90,
			.rotate90to0,
			.rotate0to_90,
			.rotate_90to0 {
			  animation-duration: 0.3s;
			  animation-fill-mode: forwards;
			}

			@keyframes r0to90 {
			  from {
				transform:rotateX(0deg);
			  }

			  to {
				transform: rotateX(90deg);
			  }
			}

			@keyframes r90to0 {
			  from {
				transform: rotateX(90deg);
			  }

			  to {
				transform: rotateX(0deg);
			  }
			}

			@keyframes r0to_90 {
			  from {
				transform: rotateX(0deg);
			  }

			  to {
				transform: rotateX(-90deg);
			  }
			}

			@keyframes r_90to0 {
			  from {
				transform: rotateX(-90deg);
			  }

			  to {
				transform: rotateX(0deg);
			  }
			}

			.transform0to_90 {
			  transform: rotateX(-90deg);
			}

			.transform0to90 {
			  transform: rotateX(90deg);
			}
			.hide{
				display:none
			}
			.zIndex2 {
			  z-index: 2;
			}

			.zIndex4 {
			  z-index: 4;
			}

			.zIndex10 {
			  z-index: 10;
			}
			.blue{
			   background-color: blue
			}
			.green{
			   background-color: green
			}
			.red{
			   background-color: red
			}
			.orange{
			  background-color: orange
			}
		</style>
		<script>
			let baseDiv,lowerDiv,middleDiv,upperDiv;
			document.addEventListener("DOMContentLoaded",()=>{
				baseDiv=document.getElementById("base");
				lowerDiv=document.getElementById("lower");
				middleDiv=document.getElementById("middle");
				upperDiv=document.getElementById("upper");
			});
			let backward=()=>{
			    middleDiv.innerHTML=baseDiv.innerHTML;
				lowerDiv.classList.add("rotate0to90");
				middleDiv.className="upperHalfCard-after transform0to_90 zIndex4";
			}
			let forward=()=>{
				middleDiv.innerHTML=baseDiv.innerHTML;
				upperDiv.classList.add("rotate0to_90");
				middleDiv.className="lowerHalfCard-after transform0to90 zIndex4";
			}
			
			let upperHandler=()=>{
				middleDiv.classList.add("rotate90to0");
				upperDiv.classList.replace("zIndex4","zIndex2");				
			}
			let lowerHandler=()=>{
				lowerDiv.classList.replace("zIndex4","zIndex2");
				middleDiv.classList.add("rotate_90to0");				
			}
			let middleHandler=()=>{
				upperDiv.innerHTML=baseDiv.innerHTML;
				lowerDiv.innerHTML=baseDiv.innerHTML;
				middleDiv.className="hide";
				upperDiv.className="upperHalfCard-after zIndex4";
				lowerDiv.className="lowerHalfCard-after zIndex2";
			}
		</script>
	</head>
	<body>
		<div class="splitFlap">
			<div 
				id="base" 
				class="fullCard-after zIndex2">
				<img src="img/1_100.png">
			</div>
			<div 
				class="upperHalfCard-after zIndex4"
				id="upper"
				onAnimationEnd="upperHandler()">
				<img src="img/0_100.png">
			</div>
			<div 
				id="middle"
				class="hide"
				onAnimationEnd="middleHandler()">
			</div>
			<div
				class="lowerHalfCard-after zIndex2" 
				id="lower"
				onAnimationEnd="lowerHandler()">
				<img src="img/0_100.png">
			</div>
		</div>
		<p>
			<button onClick="forward()">
			  +
			</button>
			<button onClick="backward()">
			 -
			</button>
			<button onClick="setHinge()">Set Hinge</button>
		</p>
	</body>
</html>	

I am creating a split-flap. It works fine in Chrome, but in firefox, during the second rotation period, it is not smooth as in chrome. How can I fix it?

Asked by knvbhk 6 days ago