How can I detect the IDs elements from firefox interface?
Hi everyone,
I want to use userChrome.css file to change things in firefox (ex: context menu order, context menu items, right click menu in page, font in tabs... and many other things)... For changing these, I must know the IDs or CLASSes of the selectors/elements and at this link, I can see only a few of everything from firefox http://kb.mozillazine.org/UserChrome.css_Element_Names/IDs#Firefox_menus Which means that I need a tool or something with who I can point the mouse to the item which I want to know the ID/CLASS to put it in userChrome.css for chaning the design. How can I do that? Because, ok, the default ones are somewhere in that link, but I installed many addons and I want to know the IDs from everything. A tool similar to "Inspect element" but for Firefox Interface
Thank you in advance!
Zmodyfikowany przez pickone w dniu
Wybrane rozwiązanie
You can inspect the local copy of the source code of the tolbar area if you paste the following address to the address bar and press Enter/Return to load it:
view-source:chrome://browser/content/browser.xul
That's hard to read as plain text. If you save it locally with a .xml extension and open it in an editor that can add syntax coloring to XML, that will make it easier to spot the ID and class attributes.
Note: The source file doesn't show dynamically generated content like the address bar drop-down or your bookmarks.
To explore interactively, check out the Browser Toolbox. See: https://developer.mozilla.org/docs/To.../Browser_Toolbox. It's not as convenient as the old DOM Inspector combined with the old Element Inspector, but hopefully it will continue to improve.
Przeczytaj tę odpowiedź w całym kontekście 👍 2Wszystkie odpowiedzi (6)
By the way, we are talking about the new version of firefox ... => 57.0
Wybrane rozwiązanie
You can inspect the local copy of the source code of the tolbar area if you paste the following address to the address bar and press Enter/Return to load it:
view-source:chrome://browser/content/browser.xul
That's hard to read as plain text. If you save it locally with a .xml extension and open it in an editor that can add syntax coloring to XML, that will make it easier to spot the ID and class attributes.
Note: The source file doesn't show dynamically generated content like the address bar drop-down or your bookmarks.
To explore interactively, check out the Browser Toolbox. See: https://developer.mozilla.org/docs/To.../Browser_Toolbox. It's not as convenient as the old DOM Inspector combined with the old Element Inspector, but hopefully it will continue to improve.
P.S. You can share ideas and problems here: https://www.reddit.com/r/FirefoxCSS/
Many thanks for this informations.. I must check them asap :D
Ok... till now I find Browser Toolbox very useful because it is similar or identical with Inspect element... BUT, how can I point the "Pick an element from the page" with the mouse to the menu where I must right click to see it? :D
Oh, I found out myself :)) It is a very good tool