Greasy Fork is available in English.
独立悬浮菜单，一键打开B站、X、P、YouTube等平台
// ==UserScript==
// @name 全局快捷平台跳转·可折叠独立版
// @namespace http://tampermonkey.net/
// @version 1.0
// @description 独立悬浮菜单，一键打开B站、X、P、YouTube等平台
// @match *://*/*
// @grant none
// @run-at document-idle
// ==/UserScript==
(function() {
'use strict';
// —————— 快捷平台列表 ——————
const SITES = [
{ name: "B站", url: "https://www.bilibili.com/" },
{ name: "X/Twitter", url: "https://x.com/" },
{ name: "YouTube", url: "https://www.youtube.com/" },
{ name: "Pinterest", url: "https://www.pinterest.com/" },
{ name: "TikTok", url: "https://www.tiktok.com/" },
{ name: "Kimi", url: "https://kimi.moonshot.cn/" },
{ name: "豆包", url: "https://www.doubao.com/" },
{ name: "百度", url: "https://www.baidu.com/" },
{ name: "Github", url: "https://github.com/" },
{ name: "知乎", url: "https://www.zhihu.com/" }
];
// 防重复注入
if (document.getElementById('quick-nav-panel')) return;
// —————— 根容器 ——————
const root = document.createElement('div');
root.id = 'quick-nav-panel';
root.style.cssText = `
all: initial;
position: fixed;
z-index: 9999998;
left: 20px;
bottom: 320px;
width: 180px;
font-family: system-ui, sans-serif;
user-select: none;
`;
document.body.appendChild(root);
// —————— 折叠标题栏 ——————
const bar = document.createElement('div');
bar.style.cssText = `
background: #ff4081;
color: #fff;
padding: 10px 12px;
border-radius: 10px 10px 0 0;
font-size: 14px;
font-weight: 500;
display: flex;
justify-content: space-between;
align-items: center;
cursor: move;
`;
bar.innerHTML = `<span>快捷跳转</span><span id="nav-fold">−</span>`;
root.appendChild(bar);
// —————— 内容面板 ——————
const panel = document.createElement('div');
panel.style.cssText = `
background: #fff;
border-radius: 0 0 10px 10px;
padding: 10px;
box-shadow: 0 4px 16px rgba(0,0,0,0.15);
max-height: 280px;
overflow-y: auto;
/* 滚动条美化 */
::-webkit-scrollbar { width: 5px; }
::-webkit-scrollbar-thumb { background: #ddd; border-radius: 5px; }
::-webkit-scrollbar-track { background: #f7f7f7; }
`;
root.appendChild(panel);
// —————— 生成按钮 ——————
SITES.forEach(site => {
const btn = document.createElement('div');
btn.textContent = site.name;
btn.style.cssText = `
padding: 8px 10px;
margin-bottom: 6px;
background: #f5f5f5;
border-radius: 6px;
font-size: 13px;
cursor: pointer;
text-align: center;
`;
btn.onmouseover = () => btn.style.background = '#eaeaea';
btn.onmouseout = () => btn.style.background = '#f5f5f5';
btn.onclick = () => window.open(site.url, '_blank');
panel.appendChild(btn);
});
// —————— 折叠功能 ——————
const foldBtn = document.getElementById('nav-fold');
foldBtn.style.cursor = 'pointer';
foldBtn.onclick = () => {
const hidden = panel.style.display === 'none';
panel.style.display = hidden ? 'block' : 'none';
foldBtn.textContent = hidden ? '−' : '+';
bar.style.borderRadius = hidden ? '10px' : '10px 10px 0 0';
};
// —————— 拖拽功能（只拖标题栏） ——————
let isDrag = false, startX, startY, origLeft, origTop;
bar.addEventListener('mousedown', e => {
if (e.target === foldBtn) return;
isDrag = false;
startX = e.clientX;
startY = e.clientY;
origLeft = root.offsetLeft;
origTop = root.offsetTop;
const move = ev => {
const dx = ev.clientX - startX;
const dy = ev.clientY - startY;
if (Math.abs(dx) > 4 || Math.abs(dy) > 4) isDrag = true;
root.style.left = origLeft + dx + 'px';
root.style.top = origTop + dy + 'px';
};
const up = () => {
document.removeEventListener('mousemove', move);
document.removeEventListener('mouseup', up);
};
document.addEventListener('mousemove', move);
document.addEventListener('mouseup', up);
});
})();