网站首页 > 基础教程 正文
喂饭命令:写一个“油猴脚本”浏览器滚动条美化
deepseek写完后有说明、使用方法、注意事项
复制脚本到油猴管理面板新建用户脚本
保存后的脚本,在已安装的脚本中查看。
浏览器滚动条美化脚本未打开效果图
浏览器滚动条美化脚本打开效果图
脚本代码
// ==UserScript==
// @name 动态美化滚动条
// @namespace http://tampermonkey.net/
// @version 1.1
// @description 通过右键菜单动态调整滚动条大小(大、中、小)
// @author 科技鸢
// @match *://*/*
// @grant GM_registerMenuCommand
// @grant GM_addStyle
// ==/UserScript==
(function () {
'use strict';
// 定义滚动条样式
const scrollbarStyles = {
large: `
::-webkit-scrollbar {
width: 12px;
height: 12px;
}
::-webkit-scrollbar-thumb {
background: #888;
border-radius: 10px;
}
::-webkit-scrollbar-thumb:hover {
background: #555;
}
`,
medium: `
::-webkit-scrollbar {
width: 9px;
height: 9px;
}
::-webkit-scrollbar-thumb {
background: #888;
border-radius: 8px;
}
::-webkit-scrollbar-thumb:hover {
background: #555;
}
`,
small: `
::-webkit-scrollbar {
width: 6px;
height: 6px;
}
::-webkit-scrollbar-thumb {
background: #888;
border-radius: 6px;
}
::-webkit-scrollbar-thumb:hover {
background: #555;
}
`,
};
// 默认样式
let currentStyle = scrollbarStyles.small;
// 添加样式到页面
function applyScrollbarStyle(style) {
const styleId = 'custom-scrollbar-style';
let styleElement = document.getElementById(styleId);
if (!styleElement) {
styleElement = document.createElement('style');
styleElement.id = styleId;
document.head.appendChild(styleElement);
}
styleElement.textContent = style;
}
// 初始化应用默认样式
applyScrollbarStyle(currentStyle);
// 注册右键菜单选项
GM_registerMenuCommand('滚动条大小: 大', () => {
currentStyle = scrollbarStyles.large;
applyScrollbarStyle(currentStyle);
});
GM_registerMenuCommand('滚动条大小: 中', () => {
currentStyle = scrollbarStyles.medium;
applyScrollbarStyle(currentStyle);
});
GM_registerMenuCommand('滚动条大小: 小', () => {
currentStyle = scrollbarStyles.small;
applyScrollbarStyle(currentStyle);
});
})();
只要你有想法,可以做出天马行空的创意脚本,今天的分享到这里结束了,感谢大家能够看到这里,如本文章对你有用,请点赞、评价、转发和发表您的观点!
猜你喜欢
- 2025-05-28 教你如何利用AI快速开发一款价值1万美元的App(De...
- 2025-05-28 联想第五次创业,再次绕开核心科技
- 2025-05-28 通过AI提示词让Deepseek快速生成各种类型的图表制作
- 2025-05-28 一分钟教会你在Excel里面接入DeepSeek,我们一起帮哪吒逆天改命
- 2025-05-28 这15个Android开源库,只有经常逛Github的才知道
- 2025-05-28 Android漂亮的滑动条
- 2025-05-28 三星使用说明书之一(相册篇)
- 2024-07-24 安卓开发开源框架-AndroidAnnotations(一)
- 2024-07-24 Appium控件交互策略:优化自动化测试效率的关键方法
- 2024-07-24 LiveData与ViewModel结合,看起来挺完美
- 最近发表
- 标签列表
-
- jsp (69)
- gitpush (78)
- gitreset (66)
- python字典 (67)
- dockercp (63)
- gitclone命令 (63)
- dockersave (62)
- linux命令大全 (65)
- pythonif (86)
- location.href (69)
- dockerexec (65)
- tail-f (79)
- queryselectorall (63)
- location.search (79)
- bootstrap教程 (74)
- deletesql (62)
- linuxgzip (68)
- 字符串连接 (73)
- html标签 (69)
- c++初始化列表 (64)
- mysqlinnodbmyisam区别 (63)
- arraylistadd (66)
- mysqldatesub函数 (63)
- window10java环境变量设置 (66)
- c++虚函数和纯虚函数的区别 (66)