// ==UserScript==
// @name Bilibili 动态美化
// @namespace http://tampermonkey.net/
// @version 0.6
// @description 动态粉粉嫩嫩，功能：1. 美化页面；2. 隐藏个人动态发布框；3. 隐藏右侧热门话题；4. 隐藏up发布的广告动态。希望大家多提意见，谢谢大家。
// @author Water WHNI
// @match https://t.bilibili.com/*
// @grant GM_addStyle
// @grant GM_registerMenuCommand
// @grant GM_setValue
// @grant GM_getValue
// @license MIT
// ==/UserScript==
(function () {
'use strict';
// 获取自定义字段
const defaultSettings = {
customBackgroundURL: 'https://i0.hdslb.com/bfs/article/bfecb9a12cb9708d8d79bb9c17532e347747aeaf.jpg@1256w_708h_!web-article-pic.avif',
hideElementsEnabled: true,
hideRightSidebar: true,
hidePostBar: true,
autoFrash: true,
autoClickInterval: 5,
enableAutoClick: true,
backgroundTransparency: 61,
backgroundTransparency2: 81,
backgroundTransparencyFloat: 91
};
const settings = {};
for (const key in defaultSettings) {
settings[key] = GM_getValue(key, defaultSettings[key]);
}
// 修改样式
const styles = `
.bili-dyn-card-video__body, .bili-dyn-card-live__body, .bili-dyn-card-pgc__body, .adblock-tips {border: none !important;}
.adblock-tips {display: none !important;}
.bili-dyn-sidebar {right: 5vw !important;}
.bili-header__channel {background: none !important;}
.bili-dyn-up-list__item__name.bili-ellipsis, .bili-dyn-time.fs-small, .item-desc, .bili-dyn-action, .bili-dyn-more__btn, .bili-dyn-card-video__stat__item, #bili-header-container span, svg {color: rgb(251, 114, 153) !important;}
.bili-dyn-interaction__item__desc .bili-rich-text__content {color: #2f3238e0 !important;}
.header-upload-entry {background-color: #fc8bab6b !important;}
.bili-dyn-more__btn:hover {background-color: #fa5a5742 !important; border-radius: 50% !important;}
.bili-dyn-card-video__desc, .bili-dyn-publishing__hint {color: #424549 !important;}
.bili-dyn-list-notification.fs-small {color: rgb(251, 114, 153) !important;}
.bili-dyn-content {
border: 2px solid transparent !important;
border-radius: 10px !important;;
box-shadow: 0 0 0 rgb(251, 114, 153) !important;
transition: box-shadow 0.3s ease-in-out !important;
}
.bili-dyn-content:hover {
box-shadow: 0 0 15px rgb(251, 114, 153), 0 0 15px rgb(251, 114, 153) !important;
background-color: #ffffff80 !important;
}
.bili-dyn-up-list__item__face {
border: 1px solid transparent !important;;
box-shadow: 0 0 0 rgb(251, 114, 153) !important;
transition: box-shadow 0.3s ease-in-out !important;
}
.bili-dyn-up-list__item__face:hover {
box-shadow: 0 0 5px rgb(251, 114, 153), 0 0 5px rgb(251, 114, 153) !important;;
}
.bili-dyn-up-list__nav.next .bili-dyn-up-list__nav__shadow {
background: linear-gradient(90deg, hsla(0, 0%, 100%, 0), rgb(251 114 153 / 60%) !important;
}
.bili-dyn-up-list__nav__shim {
background: rgb(251 114 153 / 60%) !important;
}
.bili-dyn-up-list__nav.prev .bili-dyn-up-list__nav__shadow {
background: linear-gradient(270deg, hsla(0, 0%, 100%, 0), rgb(251 114 153 / 60%) !important;
}
.bili-album__watch__content {height: 30vw !important;}
.bili-album__watch__content img {height: 30vw !important; max-width: 60% !important;}
:root {
--bg1: rgba(255, 255, 255, ${settings.backgroundTransparency / 100}) !important;
--bg2: rgba(255, 255, 255, ${settings.backgroundTransparency2 / 100}) !important;
--bg1_float: rgba(255, 255, 255, ${settings.backgroundTransparencyFloat / 100}) !important;
}
`;
GM_addStyle(styles);
// 菜单功能函数
const applyBackgroundImage = (url) => {
GM_addStyle(`
.bg {
background-image: url("${url}") !important;
background-size: cover !important;
background-attachment: fixed !important;
background-position: center center !important;
background-repeat: no-repeat !important;
height: 100% !important;
}
`);
};
const hideSpecificElements = () => {
document.querySelectorAll('.bili-dyn-list__item').forEach(item => {
if (item.querySelector('.bili-rich-text-module.goods')) {
item.style.display = 'none';
}
});
};
const setupHideElements = () => {
if (settings.hideElementsEnabled) {
hideSpecificElements();
new MutationObserver(hideSpecificElements).observe(document.body, {childList: true, subtree: true});
}
};
const applyBackgroundTransparency = (transparency, tB2, bg1F) => {
GM_addStyle(`
:root {
--bg1: rgba(255, 255, 255, ${transparency / 100}) !important;
--bg2: rgba(255, 255, 255, ${tB2 / 100}) !important;
--bg1_float: rgba(255, 255, 255, ${bg1F / 100}) !important;
}
`);
};
// 菜单功能实现
setupHideElements();
applyBackgroundImage(settings.customBackgroundURL);
if (settings.hideRightSidebar) {
GM_addStyle('.right { display: none !important; }');
GM_addStyle('#app > div.bili-dyn-home--member > main { width: 70vw !important; }');
}
if (settings.hidePostBar) {
GM_addStyle('.bili-dyn-publishing { display: none !important; }');
GM_addStyle('#app > div.bili-dyn-home--member > main > section:nth-child(1) {display : none !important;}');
GM_addStyle('.bili-dyn-up-list__window {padding: 20px 0 20px !important;}');
GM_addStyle('.bili-dyn-up-list__window {margin-top: 2px !important;}');
}
applyBackgroundTransparency(settings.backgroundTransparency, settings.backgroundTransparency2, settings.backgroundTransparencyFloat);
// 定时检查并点击元素
const checkAndClick = () => {
const selector = '#app > div.bili-dyn-home--member > main > section:nth-child(3) > div.bili-dyn-list > div.bili-dyn-list__notification > div';
const element = document.querySelector(selector);
if (element) {
try {
element.dispatchEvent(new MouseEvent('click', {bubbles: true, cancelable: true}));
} catch (e) {
const event = document.createEvent('Event');
event.initEvent('click', true, true);
element.dispatchEvent(event);
}
}
};
// 修改定时检查并点击功能实现
let autoClickIntervalId;
const setupAutoClick = () => {
if (settings.enableAutoClick) {
autoClickIntervalId = setInterval(checkAndClick, settings.autoClickInterval * 1000);
}
};
setupAutoClick();
// 创建隐藏开关
const createToggle = (label, key) => {
const container = document.createElement('div');
container.style.cssText = `
margin-bottom: 10px;
display: flex;
align-items: center;
justify-content: space-between;
`;
const toggleLabel = document.createElement('label');
toggleLabel.innerText = label;
toggleLabel.style.cssText = `
margin: 0;
`;
const checkbox = document.createElement('input');
checkbox.type = 'checkbox';
checkbox.checked = settings[key];
checkbox.style.cssText = `
margin-left: 10px;
`;
checkbox.onchange = () => settings[key] = checkbox.checked;
container.append(toggleLabel, checkbox);
return {container, checkbox};
};
// 注册菜单
// 注册菜单
GM_registerMenuCommand('设置', () => {
// 创建悬浮框
const modal = document.createElement('div');
modal.style.cssText = `
position: fixed;
top: 8vh;
right: 1vw;
padding: 20px;
background-color: #fff;
box-shadow: 0 0 15px rgba(0, 0, 0, 0.3);
border-radius: 10px;
z-index: 9999;
width: 320px;
font-family: Arial, sans-serif;
overflow: auto;
`;
// 标题
const modalHeader = document.createElement('div');
modalHeader.style.cssText = `
font-size: 20px;
font-weight: bold;
margin-bottom: 15px;
text-align: center;
`;
modalHeader.innerText = '设置';
// 创建自定义背景图片输入框及应用按钮
const bgInputContainer = document.createElement('div');
bgInputContainer.style.cssText = `
display: flex;
align-items: center;
margin-bottom: 10px;
width: 100%;
`;
const bgInputLabel = document.createElement('label');
bgInputLabel.innerText = '背景图片URL: ';
bgInputLabel.style.cssText = `
flex: 0 0 35%;
`;
const bgInput = document.createElement('input');
bgInput.type = 'text';
bgInput.value = settings.customBackgroundURL;
bgInput.style.cssText = `
flex: 1;
padding: 5px;
border: 1px solid #ccc;
border-radius: 5px;
margin-left: 10px;
overflow: hidden;
text-overflow: ellipsis;
`;
const applyBgButton = document.createElement('button');
applyBgButton.innerText = '应用';
applyBgButton.style.cssText = `
width: 100%;
padding: 5px 10px;
background-color: #12a9df;
color: white;
border: none;
border-radius: 5px;
cursor: pointer;
margin-bottom: 5px;
`;
applyBgButton.onclick = () => {
const newURL = bgInput.value;
GM_setValue('customBackgroundURL', newURL);
applyBackgroundImage(newURL);
};
bgInputContainer.append(bgInputLabel, bgInput);
// 创建隐藏开关
const {
container: hideUpAdContainer,
checkbox: hideUpAdCheckbox
} = createToggle('隐藏UP广告动态', 'hideElementsEnabled');
const {
container: hideSidebarContainer,
checkbox: hideSidebarCheckbox
} = createToggle('隐藏右边栏', 'hideRightSidebar');
const {
container: hidePostBarContainer,
checkbox: hidePostBarCheckbox
} = createToggle('隐藏动态发布', 'hidePostBar');
const {
container: timerToggleContainer,
checkbox: timerToggleCheckbox
} = createToggle('自动加载新动态', 'enableAutoClick');
// 点击间隔输入框
const intervalContainer = document.createElement('div');
intervalContainer.style.cssText = `
display: flex;
align-items: center;
margin-bottom: 10px;
width 100%;
`;
const intervalLabel = document.createElement('label');
intervalLabel.innerText = '点击间隔 (秒): ';
intervalLabel.style.cssText = `
flex: 0 0 35%;
`;
const intervalInput = document.createElement('input');
intervalInput.type = 'number';
intervalInput.min = '1';
intervalInput.value = settings.autoClickInterval || 5;
intervalInput.style.cssText = `
flex: 1;
padding: 5px;
margin-left: 10px;
border: 1px solid #ccc;
border-radius: 5px;
`;
intervalInput.oninput = () => {
const interval = Math.max(1, parseInt(intervalInput.value));
settings.autoClickInterval = interval;
GM_setValue('autoClickInterval', interval);
if (settings.enableAutoClick) {
clearInterval(autoClickIntervalId);
autoClickIntervalId = setInterval(checkAndClick, interval * 1000);
}
};
intervalContainer.append(intervalLabel, intervalInput);
// 背景透明度滑块
const sliderContainer = document.createElement('div');
sliderContainer.style.cssText = `
display: flex;
align-items: center;
margin-bottom: 10px;
width: 100%;
`;
const sliderLabel = document.createElement('label');
sliderLabel.innerText = '背景透明度: ';
sliderLabel.style.cssText = `
flex: 0 0 35%;
`;
const slider = document.createElement('input');
slider.type = 'range';
slider.min = '0';
slider.max = '100';
slider.value = settings.backgroundTransparency;
slider.style.cssText = `
flex: 1;
margin-left: 5px;
`;
slider.oninput = () => {
const transparency = parseInt(slider.value);
settings.backgroundTransparency2 = Math.min(transparency + 20, 100);
settings.backgroundTransparencyFloat = Math.min(transparency + 50, 100);
GM_setValue('backgroundTransparency', transparency);
GM_setValue('backgroundTransparency2', settings.backgroundTransparency2);
GM_setValue('backgroundTransparencyFloat', settings.backgroundTransparencyFloat);
applyBackgroundTransparency(transparency, settings.backgroundTransparency2, settings.backgroundTransparencyFloat);
};
sliderContainer.append(sliderLabel, slider);
// 创建按钮容器
const buttonContainer = document.createElement('div');
buttonContainer.style.cssText = `
display: flex;
justify-content: space-between;
margin-top: 15px;
`;
const closeButton = document.createElement('button');
closeButton.innerText = '关闭';
closeButton.style.cssText = `
padding: 5px 10px;
background-color: #f44336;
color: white;
border: none;
border-radius: 5px;
cursor: pointer;
`;
closeButton.onclick = () => document.body.removeChild(modal);
const saveButton = document.createElement('button');
saveButton.innerText = '保存';
saveButton.style.cssText = `
padding: 5px 10px;
background-color: #4CAF50;
color: white;
border: none;
border-radius: 5px;
cursor: pointer;
`;
saveButton.onclick = () => {
GM_setValue('hideElementsEnabled', hideUpAdCheckbox.checked);
GM_setValue('hideRightSidebar', hideSidebarCheckbox.checked);
GM_setValue('hidePostBar', hidePostBarCheckbox.checked);
GM_setValue('enableAutoClick', timerToggleCheckbox.checked);
GM_setValue('autoClickInterval', Math.max(1, parseInt(intervalInput.value)));
location.reload();
};
buttonContainer.append(saveButton, closeButton);
// 添加元素到悬浮框
modal.append(
modalHeader,
bgInputContainer, applyBgButton,
hideUpAdContainer,
hideSidebarContainer,
hidePostBarContainer,
timerToggleContainer,
intervalContainer,
sliderContainer,
buttonContainer
);
document.body.appendChild(modal);
});
})();
