作者JohnWalk (論辯倫理學)
看板Browsers
標題Re: [-Fx-] 隱藏上方頁籤列和工具列
時間Wed Apr 10 16:15:01 2019
原文恕刪
原本想要使用kizajan大的css，但發現使用後分頁列（TabsToolBar）不會自動滑出。
我的版本最新的是66.0.2，不知道是否是因為更新的關係？有人遇到一樣的問題嗎？
後來，我參考kizajan大的寫法，改成以下比較簡略的設定後，得到了近似的效果：
======
/*設定變數，可調整*/
:root{
--top:-61.7px;
--open: 0s;
--close: 0.5s;
--dur: 0.1s;
}
/*全畫面上移*/
#content-deck {
margin-top: calc(var(--top) - 1px);
}
/*影片全螢幕時不上移*/
#main-window[inFullscreen]
#content-deck{
margin-top: 0px !important;
}
/*分頁列底色設定*/
toolbar
#TabsToolbar
{
-moz-appearance: none !important;
background-color: #000000 !important;
}
#navigator-toolbox {
padding-top: 0px;
z-index: 99998;
transform: translate(0, var(--top));
transition: all var(--dur) ease-in var(--close);
}
#navigator-toolbox:hover,
#navigator-toolbox:focus-within {
transform: translate(0, 0);
transition: all var(--dur) ease-out var(--open);
}
#navigator-toolbox:hover
#PersonalToolbar{
transform: translate(0, 0) !important ;
transition: all calc(var(--dur) - 0.1s) ease-out var(--open) !important;
}
======
註：由於我是使用左側自動隱藏的懸浮側邊欄，因此拿掉了書籤列（PersonalToolbar）
的效果。
不過在此遇到了一個問題，就是滑鼠指到分頁列特定位置時，整個列會立即縮回，
也就是某些特定位置沒有hover的效果。見下圖紅色框框處：
https://imgur.com/YdiqrPM
懇請高手的幫助！
4/12更新
增加了以下的內容，但仍未完全解決。未開滿分頁的空間不知道該用什麼加以指定....
這是拿來移除「drag space」的，它是存在於分頁列最後方的一小塊空白區域
===
#TabsToolbar .titlebar-spacer{ display: none; }
===
另外，我下載了Load Progress Bar這個附加元件，想在最下方顯示網頁讀取的狀態
但是左下角一直會文字干擾，請問有辦法隱藏嗎？如果可以的話，也希望滑鼠指向
超連結時，於同一個地方也不會出現網址列。
（如下圖）
https://imgur.com/zU0VUTd
--
※ 發信站: 批踢踢實業坊(ptt.cc), 來自: 101.136.235.52
※ 文章網址: https://webptt.com/m.aspx?n=bbs/Browsers/M.1554884103.A.4DC.html
※ 編輯: JohnWalk (101.137.6.215), 04/12/2019 01:06:37
1F：推 kizajan: 我後來有改了 04/03 23:07