分享自动隐藏书签栏的userchrome.css

之前看过论坛里很多关于自动隐藏书签栏的帖子，总有部分不完美，例如：
1，不能设置延迟hover时间，导致一移动鼠标就弹出来。希望正常移动不会造成弹出
2，bookmark弹出后页面跳动，希望弄成悬浮出现。
3，hover到标签栏和地址栏时都弹出。希望可以只hover地址栏时弹出（之前一位朋友也求过）。

折腾了大半天，结合了好多人的脚本，如下，感觉已经挺完美的了。

@namespace url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul);


#PersonalToolbar {
  visibility: hidden !important;
  opacity: 0;
  -moz-transition-duration: 0.3s;
  -moz-transition-property: visibility, opacity, margin;
  -moz-transition-delay: 1s}       /*设置多少秒bookmark消失*/

#nav-bar:hover~#PersonalToolbar,#PersonalToolbar:hover /*此处为hover地址栏自动弹出bookmark，若想hover地址栏+标签栏，请改#navigator-toolbox:hover > */
{
  visibility: visible !important;
  opacity: 1;
  -moz-transition-delay: 0.4s}   /*设置多少秒后延迟出现*/

#PersonalToolbar {
  position: fixed !important;
  margin-top: 40px !important}
  
#nav-bar:hover~#PersonalToolbar,#PersonalToolbar:hover /*此处为hover地址栏自动弹出bookmark，若想hover地址栏+标签栏，请改#navigator-toolbox:hover > */
{
  margin-top: 52px !important}
  
#main-window[stylish-url="about:addons"] #PersonalToolbar {
  margin-top: 25px !important;
  background: transparent !important; border: none !important}

#main-window[stylish-url="about:addons"] #PersonalToolbar {
  display: none !important}


#PersonalToolbar {
  background-color: #e6e7e7 !important;
}

感谢，感谢 两位分享

yuleself：正常情况下，鼠标要指向红框内的nav-bar的时候书签栏才显示出来；如果书签栏显示出来了，鼠标悬停在书签栏上的时候，书签栏会一直显示；这正是我想要的效果。


偶尔出现的问题如下图，有时候书签栏没有显示，但是我鼠标悬停在红色框框的部分...回到原帖

自己摸索搞定了，把

#PersonalToolbar {visibility: hidden;
opacity: 0;
position: fixed !important;

中的

visibility: hidden;

换成

visibility: collapse;

正常情况下，鼠标要指向红框内的nav-bar的时候书签栏才显示出来；如果书签栏显示出来了，鼠标悬停在书签栏上的时候，书签栏会一直显示；这正是我想要的效果。

图片：QQ截图20140617085621.png

偶尔出现的问题如下图，有时候书签栏没有显示，但是我鼠标悬停在红色框框的部分时，书签栏还是会显示出来，遮住了“论坛”、“Firefox 桌面版”等菜单，只有在鼠标离开该区域的时候书签栏才会重新隐藏，如果鼠标重新回到改区域，书签栏又会重新弹出来，完全点不了被遮住的菜单。

图片：QQ截图20140617085644.png

按照我那个CSS的路子，确实是鼠标悬停在书签栏的时候书签栏应该显示出来才对；只不过大多数情况下（也是我期望的），书签栏被隐藏的时候，即使鼠标悬停在书签栏的位置也不会激活显示书签栏；抽风的情况就是，即使书签栏被隐藏了，鼠标悬停在它被隐藏的位置时，仍会重新把它显示出来。

@namespace url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul);
 
#PersonalToolbar {
  visibility: hidden;
  opacity: 0;
  position: fixed !important;
  margin-top: 1px !important;
  padding-bottom:2px;
  padding-top:3.5px!important;
  width:100%;
  border-bottom:1px solid rgba(0,0,0,0.5) !important;
  border-right:1px solid #797979 !important;
  border-left:1px solid rgba(0,0,0,0.4) !important;
  box-shadow: 0px 5px 5px rgba(0,0,0,0.10) !important;
  -moz-transition-duration: 0.2s;
  -moz-transition-property: visibility, opacity, margin;
  -moz-transition-delay: .6s;
  -moz-transition-timing-function: ease-in-out;
}
  
#nav-bar:hover~#PersonalToolbar,#PersonalToolbar:hover{
  visibility: visible !important;
  opacity: 1;
  -moz-transition-delay: 0.4s;
}
   
#main-window[stylish-url="about:newtab"] #PersonalToolbar{
  visibility: visible !important;
  opacity: 1;
}
 
 
/*书签悬停效果*/
.bookmark-item {-moz-image-region: rect(0px, 16px, 16px, 0px);}
toolbarbutton.bookmark-item {-moz-appearance: none;}
toolbarbutton.bookmark-item:not(.subviewbutton):not(#bookmarks-menu-button) {margin: 0;padding: 2px 3px;}
#nav-bar #PlacesToolbar toolbarbutton {margin: 5px 0;padding: 0 4px;}
#PersonalToolbar #home-button.bookmark-item:-moz-any(:hover,[open]),
#PlacesToolbar toolbarbutton:-moz-any(:hover,[open]){
  border-color: rgba(0, 0, 0, .2);
  background-clip: padding-box;
  /*background-color: -moz-Dialog;
  box-shadow: 0 1px 0 0 rgba(0, 0, 0, .04),
              inset 0 1px 0 0 rgba(255, 255, 255, .62);*/
}

我照猫画虎改了8楼的CSS。现在有个问题就是，有时候鼠标指向书签栏出现的位置时，即时本来它是被隐藏的，也会弹出来，这样就没办法点击网页顶部的那些按钮或者链接了。很多时候重启火狐就不会有这种情况，但是老是时不时地又出现一次，很闹心。是因为nightly33的BUG还是stylish的BUG还是这个CSS不够完善呢？

FirefoxJr：http://userstyles.org/styles/45803/selectively-show-bookmarks-toolbar回到原帖

这个不是层浮的，

eagle5678：不能像chrome那样新建标签页出现吗回到原帖

http://userstyles.org/styles/45803/selectively-show-bookmarks-toolbar

不能像chrome那样新建标签页出现吗

fire/fox：可不可以鼠标指向标签栏自动显示和隐藏？因为我把工具栏按钮放进标签栏，没有工具栏了。
没人关注了吗？回到原帖

52px  改成0px

效果变成这样了，有点影响页面浏览。。。

很好用啊, 感谢楼主

war132553：之前看过论坛里很多关于自动隐藏书签栏的帖子，总有部分不完美，例如：
1，不能设置延迟hover时间，导致一移动鼠标就弹出来。希望正常移动不会造成弹出
2，bookmark弹出后页面跳动，希望弄成悬浮出现。
3，hover到标签栏和地址栏时都弹出。希望可以只hover地址栏时弹出（之前一位朋友也求过）。

折腾了大半天，结合了好多人的脚本，如下，感觉已经挺完美的了。

@namespace url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul);


#PersonalToolbar {
  visibility: hidden !important;
  opacity: 0;
  -moz-transition-duration: 0.3s;
  -moz-transition-property: visibility, opacity, margin;
  -moz-transition-delay: 1s}       /*设置多少秒bookmark消失*/

#nav-bar:hover~#PersonalToolbar,#PersonalToolbar:hover /*此处为hover地址栏自动弹出bookmark，若想hover地址栏+标签栏，请改#navigator-toolbox:hover > */
{
  visibility: visible !important;
  opacity: 1;
  -moz-transition-delay: 0.4s}   /*设置多少秒后延迟出现*/

#PersonalToolbar {
  position: fixed !important;
  margin-top: 40px !important}
  
#nav-bar:hover~#PersonalToolbar,#PersonalToolbar:hover /*此处为hover地址栏自动弹出bookmark，若想hover地址栏+标签栏，请改#navigator-toolbox:hover > */
{
  margin-top: 52px !important}
  
#main-window[stylish-url="about:addons"] #PersonalToolbar {
  margin-top: 25px !important;
  background: transparent !important; border: none !important}

#main-window[stylish-url="about:addons"] #PersonalToolbar {
  display: none !important}


#PersonalToolbar {
  background-color: #e6e7e7 !important;
}

回到原帖

鼠标到工具栏也会弹出书签，要怎么才能只在地址弹出 啊？

谢谢分享啊，这个脚本比以前的那些好多了

请问如何在你这个脚本的基础上让背景色透明呢？上面有人贴了个图 我想要那个效果。

可不可以鼠标指向标签栏自动显示和隐藏？因为我把工具栏按钮放进标签栏，没有工具栏了。
没人关注了吗？