stain
小狐狸
小狐狸
  • UID56307
  • 注册日期2018-01-25
  • 最后登录2021-07-15
  • 发帖数39
  • 经验47枚
  • 威望0点
  • 贡献值38点
  • 好评度7点
  • 社区居民
  • 忠实会员
阅读:2532回复:4

【样式】将Firefox书签工具栏定位到最底部并隐藏左下角状态栏。

楼主#
更多 发布于:2018-09-17 12:17

键盘大神和手势达人请跳过。见到有人问下图中这样的问题。可能很多人已经习惯了频繁点击Windows桌面底部的任务栏和开始菜单,而浏览器的书签工具栏在顶部,这样用鼠标操作要上下移动划过整个屏幕,很不方便效率很低。不用键盘不用手势的人肯定很苦恼。另外火狐在全屏看视频时左下角的“正在加载XXX…”也很让人恼火。解决方法和最终效果如图中所示,使用userChrome.css将火狐书签工具栏定位到最底部,并隐藏左下角状态栏。css代码如下:

@-moz-document url(chrome://browser/content/browser.xul){
  /*隐藏左下角状态栏*/
  #statuspanel-label{
    display: none !important;
  }
  /*将书签工具栏定位到最底部*/
  #PersonalToolbar{
    position: fixed !important;
    left: 0 !important;
    bottom: 0 !important;
    background-color: black !important;
    width: -moz-available !important;
    display: -webkit-box !important;
  }
  /*你的CSS代码*/
}

用火狐,想怎么折腾就怎么折腾,搞到顺手为止。

图片传不上来……编辑界面顺滑感觉很好……

下图,效果图在这里【http://tieba.baidu.com/p/5883209629

marb
非常火狐
非常火狐
  • UID56238
  • 注册日期2017-12-25
  • 最后登录2023-04-12
  • 发帖数894
  • 经验1041枚
  • 威望0点
  • 贡献值1150点
  • 好评度50点
1楼#
发布于:2018-09-17 16:32
/*自动隐藏书签侧边栏*/

:root { --sidebar-hover-width: 1px; --sidebar-visible-width: 206px;}
#sidebar-box { position: relative !important; overflow-x: hidden !important; margin-right: calc(var(--sidebar-hover-width) * -1) !important; left: var(--sidebar-hover-width) !important; min-width: var(--sidebar-hover-width) !important; max-width: var(--sidebar-hover-width) !important;}
#sidebar-box:hover { margin-right: calc(var(--sidebar-visible-width) * -1) !important; left: var(--sidebar-visible-width) !important; min-width: var(--sidebar-visible-width) !important; max-width: var(--sidebar-visible-width) !important;}
#sidebar { opacity: 0 !important;}
#sidebar:hover { opacity: 1 !important;}
#sidebar-header{display: none !important;}/*书签*/
marb
非常火狐
非常火狐
  • UID56238
  • 注册日期2017-12-25
  • 最后登录2023-04-12
  • 发帖数894
  • 经验1041枚
  • 威望0点
  • 贡献值1150点
  • 好评度50点
2楼#
发布于:2018-09-17 16:39
管理员说以后uc和userChrome可能都不让用了。还是尽早抛弃换成扩展为好。本人uc已经全部替换完毕,希望楼主尽早替换
stain
小狐狸
小狐狸
  • UID56307
  • 注册日期2018-01-25
  • 最后登录2021-07-15
  • 发帖数39
  • 经验47枚
  • 威望0点
  • 贡献值38点
  • 好评度7点
  • 社区居民
  • 忠实会员
3楼#
发布于:2018-09-18 02:30
marb:/*自动隐藏书签侧边栏*/

:root { --sidebar-hover-width: 1px; --sidebar-visible-width: 206px;}
#sidebar-box { position: relative !i...
回到原帖
感谢提醒优化,我一楼的写法除了遮挡侧边栏还会遮挡页面底部内容。
又折腾了一下,改成这样更好,全屏、操作侧栏和其他脚本也没冲突:


/*在 Firefox 63.0b6 下使用正常,其他版本未知*/
@-moz-document url(chrome://browser/content/browser.xul){
  /*隐藏左下角状态栏*/
  #statuspanel-label{
    display: none !important;
  }
  /*将书签工具栏定位到最底部*/
  #PersonalToolbar{
    position: fixed !important;
    bottom: 0 !important;
    background-color: black !important;/*背景颜色*/
    width: -moz-available !important;
    display: -webkit-box !important;
  }
  /*空出底部,防止书签工具栏阻挡页面内容*/
  #content-deck{
    margin-bottom: 19px !important;
  }
  /*全屏时收回空出的底部,隐藏置底的书签工具栏*/
  window[inFullscreen] #content-deck{
    margin-bottom: 0px !important;
  }
  window[inFullscreen] #PersonalToolbar{
    display: none !important;
  }
  /*你的CSS代码*/
}



贴吧的格式、审核简直反人类,除了人流量,这里的交流环境更好。

效果图见一楼链接。
stain
小狐狸
小狐狸
  • UID56307
  • 注册日期2018-01-25
  • 最后登录2021-07-15
  • 发帖数39
  • 经验47枚
  • 威望0点
  • 贡献值38点
  • 好评度7点
  • 社区居民
  • 忠实会员
4楼#
发布于:2018-09-18 02:45
marb:管理员说以后uc和userChrome可能都不让用了。还是尽早抛弃换成扩展为好。本人uc已经全部替换完毕,希望楼主尽早替换回到原帖
从去年升57+开始,已经替换了很多,目前有些功能扩展无法实现或不够灵活。
平台变动太大,折腾从没停过,自己的配置文件就像自己种的树,砍掉大树重新种可不容易。
游客

返回顶部