How to allow keyboard focus of links in Firefox?
Go to this ultra-simple fiddle in a Webkit browser and click on on of the inputs:
<input type="text">
<input type="text">
<input type="text">
<a href="#">my first link</a>
<a href="#">my second link</a>
<a href="#">my third link</a>
Then, notice that you can keyboard navigate through both the inputs and the links using the Tab key (and Shift+Tab to navigate in reverse order).
Now, look at the same fiddle in Firefox on Mac OS and do the same thing. The inputs receive focus, but the links won't receive focus. It's not a CSS display problem. The focus leaps from the last input to the URL bar.
I've tried endless combinations of tabindex declarations in the markup, and to no avail, e.g.:
What the heck is going on here? I will accept any answer that has:
a) a fiddle working in Firefox
b) an explanation of what exactly is going on here in Mozilla's head. It appears to contradict the spec.
tabindexs, and put tabindex="-1" on all and only the links. I don't have access to FF to test.
Ok, somebody explained this to me. It's a Mac problem. Mozilla is being true to operating system settings in Mac OS.
There are two distinct ways around this on the user side. Both seem to work:
In System Preferences → Keyboard, in the Shortcuts pane, check the “all controls” radio at the bottom. In Firefox, type "about:config" in the URL bar. There is no accessibility.tabfocus preference on the mac, so you'll have to make one. Right click in the window, create a new "integer" pref, and set it to 7.
Neither of these are terribly obvious. Also, neither of these are a server-side solution for developers, which is frustrating.
On MacOS Big Sur this is done like this:
Tick the checkbox Use keyboard navigation...
https://i.stack.imgur.com/FYrRR.png
I also didn't have to hack the about:config
Anyone looking at the second method explained within the accepted answer:
In Firefox, type "about:config" in the URL bar. There is no accessibility.tabfocus preference on the mac, so you'll have to make one. Right click in the window, create a new "integer" pref, and set it to 7.
Be aware that there is already a preference named accessibility.tabfocus within the Firefox Developer Edtion which is a boolean.
You can change this to an integer by clicking on the trash icon and deleting the preference. This will then allow you to select the type you would like the preference to be and allow you to assign it a value afterwards.
Thanks, I'm on Catalina, and the following works:
In Firefox, type "about:config" in the URL bar. There is no accessibility.tabfocus preference on the mac, so you'll have to make one. Right click in the window, create a new "integer" pref, and set it to 7.
Follow WeChat
Success story sharing
Want to stay one step ahead of the latest teleworks?
Subscribe Now相似问题
- How can I Remove .DS_Store files from a Git repository?
- Targeting only Firefox with CSS
- How to manually send HTTP POST requests from Firefox or Chrome browser
- How do I install pip on macOS or OS X?
- How to set or change the default Java (JDK) version on macOS?
- Xcode 6: Keyboard does not show up in simulator
about:config, Firefox finally allowed tab focusing. Thanks!