咱是一个 Firefox 系浏览器的忠实用户
但是在论坛浏览时候发现 Firefox 的滚动条消失,在浏览网页的时候鼠标滚轮要冒烟惹
鼠标中键又不大好用的说
而在 Chromium 测试却没有问题
如图:
Firefox:
Chromium:
前端 fw 用 F12 大法测试发现是inline style sheet #1
的scrollbar-width:none
导致
80 @-moz-document url-prefix() {
81 * {
82 scrollbar-width:none
83 }
84 }
(@-moz-document
是 Firefox 特有的设置项故 Chromium 系不受此配置项影响 )
参见 MDN
使用咱100年没有碰过的油猴脚本添加样式就可以召唤 Firefox 的滚动条惹
// ==UserScript==
// @name 显示 Firefox 在kungal的滚动条
// @namespace https://tampermonkey.net/
// @version 1.0
// @author zako
// @match https://www.kungal.com/*
// @grant GM_addStyle
// @license null
// @run-at document_end
// ==/UserScript==
(function() {
'use strict';
const css = `
* {
scrollbar-color: blue transparent;
scrollbar-width: thin;
}
body {
background-color: var(--kungalgame-blue-0);
}
`;
if (typeof GM_addStyle !== "undefined") {
GM_addStyle(css);
} else {
let styleNode = document.createElement("style");
styleNode.textContent = css;
document.head.appendChild(styleNode);
}
})();
假如你也使用 Stylus 之类自定义网页样式的扩展
则只需要为域名www.kungal.com
新建样式
* {
scrollbar-color: blue transparent;
scrollbar-width: thin;
}
body {
background-color: var(--kungalgame-blue-0);
}
这段会让滚动条更接近在 Chromium 系显示的滚动条样式(不加入情况下滚动条轨道底色是纯白(轨道颜色是透明但是透明的底下是纯白))
body {
background-color: var(--kungalgame-blue-0);
}
感谢 SaltedFishes 的建议