Greasy Fork

Greasy Fork is available in English.

哔哩哔哩标题及头像移至视频下方-优化BiliBili宽屏模式

【优化宽屏模式】此插件主要是为了兼容在宽屏模式下直接滚动至最上方会导致播放器不完整,所以把标题栏和头像移至视频下方

当前为 2022-05-19 提交的版本,查看 最新版本

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴Greasemonkey 油猴子Violentmonkey 暴力猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴Violentmonkey 暴力猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴Userscripts ,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展后才能安装此脚本。

(我已经安装了用户脚本管理器,让我安装!)

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

(我已经安装了用户样式管理器,让我安装!)

// ==UserScript==
// @name         哔哩哔哩标题及头像移至视频下方-优化BiliBili宽屏模式
// @namespace    https://github.com/iMortRex
// @version      0.0.1
// @description  【优化宽屏模式】此插件主要是为了兼容在宽屏模式下直接滚动至最上方会导致播放器不完整,所以把标题栏和头像移至视频下方
// @author       Mort Rex
// @run-at       document-end
// @match        *.bilibili.com/video/*
// @require      https://code.jquery.com/jquery-2.1.4.min.js
// @grant        GM_addStyle
// @license      CC BY-NC-SA
// ==/UserScript==


(function () {
    'use strict';

    //延迟3秒等待页面及其他脚本全部加载完毕后执行代码,否则会影响页面元素的加载及其他脚本的执行或干脆脚本执行后被后加载的页面逻辑覆盖掉
    setTimeout(function () {
        $(function main() {
            //把标题栏移至视频下方
            $('#viewbox_report').insertAfter('#playerWrap');
            //调整标题栏样式
            //为标题栏添加底部横线
            GM_addStyle(".v-wrap .video-info {border-bottom-color: rgb(42, 53, 72)}");
            GM_addStyle(".v-wrap .video-info {border-bottom: 1px solid #e5e9f0;}");
            //调整标题栏高度
            GM_addStyle(".v-wrap .video-info {height: 79px}");
            GM_addStyle(".v-wrap .video-info {padding-top: 16px}");
            GM_addStyle(".v-wrap .video-info {padding-bottom: 12px}");
            //把头像栏移至标题栏上方
            $('#v_upinfo').insertAfter('#viewbox_report');
            //调整头像栏样式
            //为头像蓝添加底部横线
            GM_addStyle(".v-wrap .up-info {border-bottom-color: rgb(42, 53, 72)}");
            GM_addStyle(".v-wrap .up-info {border-bottom: 1px solid #e5e9f0;}");
            //调整头像栏高度与标题栏一致
            GM_addStyle(".v-wrap .up-info {height: 79px;}");
            GM_addStyle(".v-wrap .up-info {padding-top: 16px}");
            GM_addStyle(".v-wrap .up-info {padding-bottom: 12px}");
            //调整头像栏宽度到100%
            GM_addStyle(".up-info .up-info_right {width: 100%;}");
            //调整充电和关注按钮与头像平齐
            GM_addStyle(".up-info .btn-panel {margin-top: -44px;}");
            //调整充电和关注按钮高度
            GM_addStyle(".up-info .btn-panel .default-btn {height: 48px;}");
            //调整名称高度
            GM_addStyle("element.style {line-height: 30px;}");
            //调整名称下面介绍高度
            GM_addStyle(".up-info .up-info_right .desc {margin-top: 9px;}");
            //调整名称下面介绍宽度
            GM_addStyle(".up-info .up-info_right .desc {width: 50%;}");

            console.log("Hello World!!");
        });
    }, 1000);//这里的时间是毫秒,可以根据自己的电脑性能进行调整
})();