简介

我有个不用的副屏，平时用来刷刷 instagram 或者 behance 之类的，配合自己些的自动滚屏脚本和 css，实现一个全屏的自动刷图。
但因为偶尔也会在这个屏上放点别的窗口，所以全屏有时候切换不方便，就希望 firefox 能自动隐藏顶部，以提供更大的展示空间。
现在实现的效果就是窗口顶部 15px，鼠标悬停可以恢复整个顶部工具栏的显示，移出后则自动隐藏，整个窗口都是浏览器的内容区，接近一个无边窗口。
压缩到 15px 高度是为了不影响原本网页上的一些顶部按钮和输入等。

方法

Step 1:
- 地址栏输入 about:config
- toolkit.legacyUserProfileCustomizations.stylesheets > true
Step 2:
- 地址栏输入 about:support > Click on "Profile Folder" -> "Open Folder"
- 在这个打开的目录下建文件夹 "chrome", 然后把下面代码存为 "userChrome.css" 放在 "chrome" 内.

/*
Firefox Hide Header / Navigator / Top / Tabs / Address / Toolbox

Step 1:
about:config > toolkit.legacyUserProfileCustomizations.stylesheets > true

Step 2:
about:support > Click on "Profile Folder" -> "Open Folder"
Create folder "chrome" here, and put this file in (as "userChrome.css").

More:
Tutorial: How to create and live-debug userChrome.css : FirefoxCSS
https://www.reddit.com/r/FirefoxCSS/comments/73dvty/tutorial_how_to_create_and_livedebug_userchromecss/
*/
@-moz-document url("chrome://browser/content/browser.xul"),
url("chrome://browser/content/browser.xhtml") {
    /*
    隐藏顶部栏
    第一行 10px 是顶部触发显示的高度。
    下面的 99px 是顶部栏的预估高度。受各种自定义设置的影响，请自行调整。
    如果只需要隐藏地址栏，保留标签栏，用 #nav-bar，然后可能需要适度调节。
    */
    #navigator-toolbox {
        max-height: 15px !important;
        z-index: 1000 !important;
        background: black !important;
        opacity: 0 !important;
        margin-bottom: -99px;
        transition: all .2s !important;
    }

    #navigator-toolbox:hover {
        max-height: none !important;
        opacity: 1 !important;
    }
}

一开始有参考 t/669207
自动滚屏的油猴脚本放 greasyfork 了，不想关联不同平台的账号，看缘分吧。
额外的参考如何使用 userChrome.css 自定义 Firefox 的用户界面 | 阳光盒子
有兴趣深入研究的，这里有比较完整的调试方法。Tutorial: How to create and live-debug userChrome.css : FirefoxCSS

[分享] Firefox 隐藏整个顶部栏 全屏显示

简介

方法

[分享] Firefox 隐藏整个顶部栏全屏显示