Greasy Fork

Greasy Fork is available in English.

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

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

当前为 2022-07-31 提交的版本,查看 最新版本

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

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

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

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

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

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

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

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

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

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

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

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

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

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

// ==UserScript==
// @name         【宽屏模式】哔哩哔哩标题及头像移至视频下方-优化BiliBili宽屏模式
// @namespace    https://github.com/iMortRex
// @version      0.1.5
// @description  【宽屏模式支持视频/番剧/列表】此插件主要是为了兼容在宽屏模式下直接滚动至最上方会导致播放器不完整,所以把标题栏和头像移至视频下方
// @author       Mort Rex
// @run-at       document-end
// @match        *.bilibili.com/video/*
// @match        *.bilibili.com/bangumi/*
// @match        *.bilibili.com/medialist/*
// @require      https://code.jquery.com/jquery-3.6.0.min.js
// @icon         https://www.bilibili.com/favicon.ico
// @grant        GM_addStyle
// @grant        GM_setValue
// @grant        GM_getValue
// @grant        GM_deleteValue
// @grant        GM_registerMenuCommand
// @grant        GM_unregisterMenuCommand
// @license      MIT
// ==/UserScript==

// 初始化全局变量
if (GM_getValue('autoWidescreenSwitch') == null) {
    // 默认打开自动宽屏模式
    GM_setValue('autoWidescreenSwitch', 1);
}

// 菜单按钮
let autoWidescreen = GM_registerMenuCommand('开关自动宽屏模式', function () {
    autoWidescreenClick();
});

// 点击菜单按钮后触发事件
function autoWidescreenClick() {
    if (GM_getValue('autoWidescreenSwitch') == 1) {
        GM_setValue('autoWidescreenSwitch', 2);
        alert('已开启自动宽屏模式');
    } else {
        GM_setValue('autoWidescreenSwitch', 1);
        alert('已关闭自动宽屏模式');
    }
}

// 执行代码
(function () {
    'use strict';

    // 自动宽屏模式
    if (GM_getValue('autoWidescreenSwitch') == 1) {
        // 当开启自动宽屏模式时再执行脚本
        var autoWidescreenEtime = 0;
        autoWidescreen();
        function autoWidescreen() {
            if (window.location.href.match('bilibili.com/bangumi/')) {
                console.log('哔哩哔哩宽屏优化-当前页面是:番剧');
                autoWidescreenBangumi();
                function autoWidescreenBangumi() {
                    if (document.getElementsByClassName('bpx-docker.bpx-docker-major div.bpx-player-container')[0] && document.getElementsByClassName('squirtle-video-widescreen squirtle-video-item')[0]) {
                        // 检测番剧页面宽屏模式相关元素是否加载完毕
                        if (document.getElementsByClassName('bpx-player-container bpx-state-paused bpx-state-no-cursor')[0].getAttribute('data-screen') == 'normal') {
                            // 如果当前不是宽屏模式则点击宽屏模式按钮
                            document.getElementsByClassName('squirtle-video-widescreen squirtle-video-item')[0].click();
                        }
                    } else {
                        // 每100毫秒检测一次,8秒后不再执行
                        autoWidescreenEtime += 100;
                        if (autoWidescreenEtime < 8000) {
                            setTimeout(autoWidescreenBangumi, 100);
                        }
                    }
                }
            } else {
                console.log('哔哩哔哩宽屏优化-当前页面是:视频');
                autoWidescreenVideo();
                function autoWidescreenVideo() {
                    if (document.getElementsByClassName('bilibili-player-video-btn bilibili-player-video-btn-widescreen')[0]) {
                        // 检测视频页面宽屏模式相关元素是否加载完毕
                        if (document.querySelector('.bilibili-player-video-btn.bilibili-player-video-btn-widescreen:not(.closed)')) {
                            // 检测当前是否已是宽屏模式
                            document.getElementsByClassName('bilibili-player-video-btn bilibili-player-video-btn-widescreen')[0].click();
                        }
                    } else {
                        // 每100毫秒检测一次,8秒后不再执行
                        autoWidescreenEtime += 100;
                        if (autoWidescreenEtime < 8000) {
                            setTimeout(autoWidescreenVideo, 100);
                        }
                    }
                }
            }
        }
    }

    var modeCheckEtime = 0;
    modeCheck();
    console.log('哔哩哔哩宽屏优化-正在检测宽屏模式');
    function modeCheck() {
        if (GM_getValue('mode') == 1 && !window.location.href.match('bilibili.com/bangumi/')) {
            // 当前不为番剧页时
            if (document.getElementById('bilibiliPlayer') && document.getElementById('bilibiliPlayer').classList.contains('mode-widescreen')) {
                console.log('哔哩哔哩宽屏优化-宽屏模式已开启');
                mainScript();
            } else {
                modeCheckEtime += 100;
                if (modeCheckEtime >= 8000) {
                    mainScript();
                } else {
                    setTimeout(modeCheck, 100);
                }
            }
        } else {
            // 延迟指定时间等待页面及其他脚本全部加载完毕后执行代码,否则会影响页面元素的加载及其他脚本的执行或干脆脚本执行后被后加载的页面逻辑覆盖掉
            setTimeout(function () {
                mainScript();
            }, GM_getValue('delayTime'));// 这里的时间是毫秒,可以根据自己的电脑性能进行调整
        }
    }

    function mainScript() {
        var viewboxCheckEtime = 0;
        viewboxCheck();
        function viewboxCheck() {
            if (document.getElementById('viewbox_report')) {
                // 把标题栏移至视频下方
                if (window.location.href.match('bilibili.com/video/')) {
                    // 视频页和列表页由于元素命名不同执行不同逻辑
                    $('#viewbox_report').insertAfter('#playerWrap');
                } else {
                    $('#viewbox_report').insertAfter('#video-player');
                }
            } else {
                viewboxCheckEtime += 100;
                if (viewboxCheckEtime >= 8000) {
                    if (window.location.href.match('bilibili.com/video/')) {
                        // 视频页和列表页由于元素命名不同执行不同逻辑
                        $('#viewbox_report').insertAfter('#playerWrap');
                    } else {
                        $('#viewbox_report').insertAfter('#video-player');
                    }
                } else {
                    setTimeout(viewboxCheck, 100);
                }
            }
        }
        // 
        var upinfoCheckEtime = 0;
        upinfoCheck();
        function upinfoCheck() {
            // 把头像栏移至标题栏下方
            if (document.getElementById('v_upinfo')) {
                // 检测头像栏是否加载完毕,如果是则继续运行
                $('#v_upinfo').insertAfter('#viewbox_report');
            } else {
                upinfoCheckEtime += 100;
                if (upinfoCheckEtime >= 8000) {
                    $('#v_upinfo').insertAfter('#viewbox_report');
                } else {
                    setTimeout(upinfoCheck, 100);
                }
            }
        }
        // 
        if (document.getElementsByClassName('v-wrap')[0]) {
            // 旧版界面
            console.log('哔哩哔哩宽屏优化-当前为旧版界面');
            // 
            if (window.location.href.match('bilibili.com/video/')) {
                // 调整标题栏样式
                /*
                为标题栏添加底部横线:横线[border-bottom]
                调整标题栏高度和上下距离:高度[height]顶部间隙[padding-top]底部间隙[padding-bottom]
                */
                // 正常使用.css方法无法添加important后缀,使用cssText强行添加important后缀,想添加某个元素就用cssText,例如:$('a').css('cssText', 'b'),删除某个元素就把后方变量留空,例如:$('a').css('b', '');
                // 移除所有style样式:$('a').removeAttr('style');
                // 改变style样式:由于cssText每次设定都会清除所有style值,所以用document.querySelector('a').style.cssText += '; 1: 1;'
                document.getElementsByClassName('video-info report-wrap-module report-scroll-module')[0].style.cssText += 'border-bottom: 1px solid #e5e9ef !important; height: 80px !important; padding-top: 16px !important; padding-bottom: 12px !important;';
                //
                // 调整头像栏样式
                /*
                为头像蓝添加底部横线:横线[border-bottom]
                调整头像栏高度与标题栏一致:高度[height]顶部间隙[padding-top]底部间隙[padding-bottom]
                */
                if (document.getElementsByClassName('members-info')[0]) {
                    $('.members-info').insertAfter('#viewbox_report');
                    document.getElementsByClassName('members-info')[0].style.cssText += 'border-bottom: 1px solid #e5e9ef !important; padding-top: 16px !important; padding-bottom: 12px !important;';
                    // 联合投稿头像栏额外操作
                    if (document.getElementsByClassName('members-info__header')[0]) {
                        document.getElementsByClassName('members-info__header')[0].style.cssText += 'margin-top: 0 !important;';
                    } else if (document.getElementsByClassName('wide-members__title')[0]) {
                        document.getElementsByClassName('wide-members__title')[0].style.cssText += 'margin-top: 0 !important;';
                    }
                } else {
                    document.getElementsByClassName('up-info report-wrap-module report-scroll-module')[0].style.cssText += 'border-bottom: 1px solid #e5e9ef !important; height: 80px !important; padding-top: 16px !important; padding-bottom: 12px !important;';
                    // 调整头像栏宽度
                    /*
                    宽度[width]位置布局[margin]
                    */
                    document.getElementsByClassName('up-info_right')[0].style.cssText += 'width: 100% !important; margin: 6px 0px 0px 62px !important;';
                    // 调整头像右边距离
                    /*
                    位置布局[margin]
                    */
                    document.getElementsByClassName('u-face')[0].style.cssText += 'margin: 2px -48px 0px 0px !important;';
                    // 调整名称
                    /*
                    调整名称高度:高度[line-height]
                    调整名称左边间距:位置布局[margin]
                    */
                    // document.getElementsByClassName('name')[0].style.cssText += 'line-height: 24px !important; margin: 4px 0px 0px 62px !important';
                    // 调整介绍
                    /*
                    调整介绍高度:顶部距离[margin-top]
                    调整介绍宽度:宽度[width]
                    */
                // document.getElementsByClassName('desc')[0].style.cssText += 'width: 45% !important;';
                    // 调整充电和关注按钮
                    /*
                    调整充电和关注按钮与头像平齐:位置布局[margin]
                    调整充电和关注按钮高度和宽度:高度[height]位置布局[margin]
                    */
                    document.getElementsByClassName('default-btn follow-btn btn-transition b-gz')[0].style.cssText += 'height: 48px !important; margin: 0px 0px 0px auto !important;';
                    document.getElementsByClassName(' btn-panel')[0].style.cssText += 'margin: -44px 6px 0px 0px !important;';
                    if (document.getElementsByClassName('default-btn charge-btn')[0]) {
                        document.getElementsByClassName('default-btn charge-btn btn-transition')[0].style.cssText += 'height: 48px !important;';
                        // 如果存在充电按钮则移除关注按钮的一个布局属性
                        document.getElementsByClassName('default-btn follow-btn btn-transition b-gz')[0].style.margin = '';
                    }
                }
                // 调整三连栏底部横线样式
                /*
                横线[border-bottom]
                */
                document.getElementsByClassName('video-toolbar report-wrap-module report-scroll-module')[0].style.cssText += 'border-bottom: 1px solid #e5e9ef !important;';
                // 额外循环判断底部横线颜色,快速循环8秒后进入缓慢循环判断模式
                var borderColorCheckEtime = 0;
                var borderColorCheckForeverSwitch = 0;
                borderColorCheck();
                function borderColorCheck() {
                    function borderColorCheckFunction() {
                        // 标题栏的横线颜色
                        document.getElementsByClassName('video-info report-wrap-module report-scroll-module')[0].style.cssText += 'border-bottom-color: ' + document.getElementsByClassName('s_tag report-wrap-module report-scroll-module')[0].style.borderBottomColor + ' !important;';
                        // 头像栏的横线颜色
                        if (!document.getElementsByClassName('members-info')[0]) {
                            document.getElementsByClassName('up-info report-wrap-module report-scroll-module')[0].style.cssText += 'border-bottom-color: ' + document.getElementsByClassName('s_tag report-wrap-module report-scroll-module')[0].style.borderBottomColor + ' !important;';
                        } else {
                            document.getElementsByClassName('members-info')[0].style.cssText += 'border-bottom-color: ' + document.getElementsByClassName('s_tag report-wrap-module report-scroll-module')[0].style.borderBottomColor + ' !important;';
                            // 联合投稿头像栏额外操作
                            if (document.getElementsByClassName('members-info__header')[0]) {
                                document.getElementsByClassName('members-info__header')[0].style.cssText += 'margin-top: 0 !important;';
                            } else if (document.getElementsByClassName('wide-members__title')[0]) {
                                document.getElementsByClassName('wide-members__title')[0].style.cssText += 'margin-top: 0 !important;';
                            }
                        }
                        // 三连栏的横线颜色
                        document.getElementsByClassName('video-toolbar report-wrap-module report-scroll-module')[0].style.cssText += 'border-bottom-color: ' + document.getElementsByClassName('s_tag report-wrap-module report-scroll-module')[0].style.borderBottomColor + ' !important;';
                    }
                    // 判断自定义的横线和标准横线的颜色是否一致,如果你想用JQ写可以用$('xxx').css('cssText', $('xxx').css('cssText') + 'XXX !important;');
                    if (document.getElementsByClassName('video-info report-wrap-module report-scroll-module')[0].style.borderBottomColor
                        != document.getElementsByClassName('s_tag report-wrap-module report-scroll-module')[0].style.borderBottomColor) {
                        borderColorCheckFunction();
                        // 开启永久循环判断
                        borderColorCheckForeverSwitch = 1;
                    } else {
                        borderColorCheckEtime += 100;
                        if (borderColorCheckEtime >= 8000) {
                            borderColorCheckFunction();
                            // 开启永久循环判断
                            borderColorCheckForeverSwitch = 1;
                        } else {
                            setTimeout(borderColorCheck, 100);
                        }
                    }
                    if (borderColorCheckForeverSwitch == 1) {
                        borderColorCheckFunction();
                        // 每隔一段时间判断一次
                        setTimeout(borderColorCheck, 1000);
                    }
                }
            } else if (window.location.href.match('bilibili.com/medialist/')) {
                var mediaListCheckEtime = 0;
                mediaListScript();
                function mediaListScript() {
                    if (document.getElementsByClassName('video-player')[0]) {
                        // 判断头像栏是否加载完毕
                        // 调整标题栏样式
                        /*
                        为标题栏添加底部横线:横线颜色[border-bottom-color]横线粗细[border-bottom]
                        调整标题栏高度和上下距离:高度[height]顶部间隙[padding-top]底部间隙[padding-bottom]
                        */
                        // 正常使用.css方法无法添加important后缀,使用cssText强行添加important后缀,想添加某个元素就用cssText,例如:$('a').css('cssText', 'b'),删除某个元素就把后方变量留空,例如:$('a').css('b', '');
                        document.getElementsByClassName('video-info report-wrap-module report-scroll-module')[0].style.cssText += 'border-bottom: 1px solid #e5e9ef !important; height: 80px !important; padding-top: 16px !important; padding-bottom: 12px !important;';
                        //
                        // 调整头像栏样式
                        /*
                        为头像蓝添加底部横线:横线颜色[border-bottom-color]横线粗细[border-bottom]
                        调整头像栏高度与标题栏一致:高度[height]顶部间隙[padding-top]底部间隙[padding-bottom]
                        */
                        if (document.getElementsByClassName('members-info')[0]) {
                            $('.members-info').insertAfter('#viewbox_report');
                            document.getElementsByClassName('members-info')[0].style.cssText += 'border-bottom: 1px solid #e5e9ef !important; padding-top: 16px !important; padding-bottom: 12px !important;';
                            //联合投稿头像栏额外操作
                            if (document.getElementsByClassName('members-info__header')[0]) {
                                document.getElementsByClassName('members-info__header')[0].style.cssText += 'margin-top: 0 !important;';
                            } else if (document.getElementsByClassName('wide-members__title')[0]) {
                                document.getElementsByClassName('wide-members__title')[0].style.cssText += 'margin-top: 0 !important;';
                            }
                        } else {
                            document.getElementsByClassName('up-info report-wrap-module report-scroll-module')[0].style.cssText += 'border-bottom: 1px solid #e5e9ef !important; height: 80px !important; padding-top: 16px !important; padding-bottom: 12px !important;';
                            // 调整头像栏宽度
                            /*
                            宽度[width]位置布局[margin]
                            */
                            document.getElementsByClassName('up-info_right')[0].style.cssText += 'width: 100% !important; margin: 6px 0px 0px 62px !important;';
                            // 调整头像右边距离
                            /*
                            位置布局[margin]
                            */
                            document.getElementsByClassName('u-face')[0].style.cssText += 'margin: 2px -48px 0px 0px !important;';
                            // 调整名称
                            /*
                            调整名称高度:高度[line-height]
                            调整名称左边间距:位置布局[margin]
                            */
                            // 调整介绍
                            /*
                            调整介绍高度:顶部距离[margin-top]
                            调整介绍宽度:宽度[width]
                            */
                        // document.getElementsByClassName('desc')[0].style.cssText += 'width: 45% !important;';
                            // $('.up-info.up-info_right.name').css('cssText', 'line-height: 24px !important; margin: 4px 0px 0px 62px !important');
                            // 调整充电和关注按钮
                            /*
                            调整充电和关注按钮与头像平齐:位置布局[margin]
                            调整充电和关注按钮高度和宽度:高度[height]位置布局[margin]
                            */
                            document.getElementsByClassName('default-btn follow-btn btn-transition b-gz')[0].style.cssText += 'height: 48px !important; margin: 0px 0px 0px auto !important;';
                            document.getElementsByClassName('btn-panel')[0].style.cssText += 'margin: -44px 6px 0px 0px !important;';
                            if (document.getElementsByClassName('default-btn charge-btn')[0]) {
                                document.getElementsByClassName('.default-btn.charge-btn.btn-transition')[0].style.cssText += 'height: 48px !important;';
                                // 如果存在充电按钮则移除关注按钮的一个布局属性
                                document.getElementsByClassName('default-btn follow-btn btn-transition b-gz')[0].style.margin = '';
                            }
                        }
                        // 调整三连栏底部横线样式
                        /*
                        横线[border-bottom]
                        */
                        document.getElementsByClassName('video-toolbar report-wrap-module report-scroll-module')[0].style.cssText += 'border-bottom: 1px solid #e5e9ef !important;';
                        // 额外循环判断底部横线颜色
                        var borderColorCheckEtime = 0;
                        var borderColorCheckForeverSwitch = 0;
                        borderColorCheck();
                        function borderColorCheck() {
                            function borderColorCheckFunction() {
                                document.getElementsByClassName('video-info report-wrap-module report-scroll-module')[0].style.cssText += 'border-bottom-color: ' + document.getElementsByClassName('s_tag report-wrap-module report-scroll-module')[0].style.borderBottomColor + ' !important;';
                                // 头像栏的横线颜色
                                if (!document.getElementsByClassName('members-info')[0]) {
                                    document.getElementsByClassName('.up-info.report-wrap-module.report-scroll-module')[0].style.cssText += 'border-bottom-color: ' + document.getElementsByClassName('s_tag report-wrap-module report-scroll-module')[0].style.borderBottomColor + ' !important;';
                                } else {
                                    document.getElementsByClassName('members-info')[0].style.cssText += 'border-bottom-color: ' + document.getElementsByClassName('s_tag report-wrap-module report-scroll-module')[0].style.borderBottomColor + ' !important;';
                                    //联合投稿头像栏额外操作
                                    if (document.getElementsByClassName('members-info__header')[0]) {
                                        document.getElementsByClassName('members-info__header')[0].style.cssText += 'margin-top: 0 !important;';
                                    } else if (document.getElementsByClassName('wide-members__title')[0]) {
                                        document.getElementsByClassName('wide-members__title')[0].style.cssText += 'margin-top: 0 !important;';
                                    }
                                }
                                // 三连栏的横线颜色
                                document.getElementsByClassName('video-toolbar report-wrap-module report-scroll-module')[0].style.cssText += 'border-bottom-color: ' + document.getElementsByClassName('s_tag report-wrap-module report-scroll-module')[0].style.borderBottomColor + ' !important;';
                            }
                            if (document.getElementsByClassName('video-info report-wrap-module report-scroll-module')[0].style.borderBottomColor
                                != document.getElementsByClassName('.s_tag.report-wrap-module.report-scroll-module')[0].style.borderBottomColor) {
                                // 判断自定义的横线和标准横线的颜色是否一致,如果不一致则改为一致
                                // 标题栏的横线颜色
                                borderColorCheckFunction();
                                // 开启永久循环判断
                                borderColorCheckForeverSwitch = 1;
                            } else {
                                borderColorCheckEtime = borderColorCheckEtime + 100;
                                if (borderColorCheckEtime >= 8000) {
                                    // 标题栏的横线颜色
                                    borderColorCheckFunction();
                                    // 开启永久循环判断
                                    borderColorCheckForeverSwitch = 1;
                                } else {
                                    setTimeout(borderColorCheck, 100);
                                }
                            }
                            if (borderColorCheckForeverSwitch == 1) {
                                borderColorCheckFunction();
                                // 每隔一段时间判断一次
                                setTimeout(borderColorCheck, 1000);
                            }
                        }
                    } else {
                        mediaListCheckEtime = mediaListCheckEtime + 100;
                        if (mediaListCheckEtime < 5000) {
                            setTimeout(mediaListScript, 100);
                        }
                    }
                }
            }
        } else {
            // 新版界面
            console.log('哔哩哔哩宽屏优化-当前为新版界面');
            // 
            // 调整标题栏样式
            /*
            为标题栏添加底部横线:横线[border-bottom]
            调整标题栏高度:高度[height]顶部间隙[padding-top]底部间隙[padding-bottom]
            */
            document.getElementsByClassName('video-info-v1')[0].style.cssText += 'border-bottom: 1px solid #e5e9ef !important; height: 86px !important; padding-top: 16px !important; padding-bottom: 12px !important;';
            //
            // 调整头像栏样式
            /*
            为头像栏添加底部横线:横线[border-bottom]
            调整头像栏高度与标题栏一致:高度[height]顶部间隙[padding-top]底部间隙[padding-bottom]位置布局[margin]
            */
            if (document.getElementsByClassName('members-info-v1')[0]) {
                $('.members-info-v1').insertAfter('#viewbox_report');
                document.getElementsByClassName('members-info-v1')[0].style.cssText += 'border-bottom: 1px solid #e5e9ef !important; padding-top: 16px !important; padding-bottom: 12px !important;';
                // 联合投稿头像栏额外操作
            } else {
                // 当不是联合投稿时
                document.getElementsByClassName('up-info-v1')[0].style.cssText += 'border-bottom: 1px solid #e5e9ef !important; height: 86px !important; padding-top: 16px !important; padding-bottom: 12px !important; margin: 0px 0px 0px 0px !important;';
                // 调整头像右侧信息/关注宽度
                /*
                宽度[width]左侧距离[margin-left]
                */
                document.getElementsByClassName('up-info_right')[0].style.cssText += 'width: 100% !important; margin-left: 0px !important;';
                // 调整头像位置
                /*
                位置布局[margin]
                */
                if (document.getElementsByClassName('u-face')[0]) {
                    document.getElementsByClassName('u-face')[0].style.cssText += 'margin: 4px 0px 0px 0px !important;';
                }
                // 调整头像栏有装饰时的位置
                /*
                宽度[width]高度[height]布局中位置[position]
                */
                if (document.getElementsByClassName('u-face has-pendant')[0]) {
                    // 存在头像装饰
                    document.getElementsByClassName('u-face has-pendant')[0].style.cssText += 'width: 48px !important; height: 48px !important;';
                    document.getElementsByClassName('u-face__avatar avatar-loaded')[0].style.cssText += 'width: 40px !important; height: 40px !important; position: unset !important;';
                }
                // 调整名称
                /*
                调整名称高度:位置布局[margin]
                */
                document.getElementsByClassName('up-info_right')[0].style.cssText += 'padding-top: 4px !important; margin: 0px 0px 0px 14px !important;';
                // 调整介绍
                /*
                调整介绍高度:位置布局[margin]
                调整介绍宽度:宽度[width]顶部间隙[padding-top]
                */
                document.getElementsByClassName('desc')[0].style.cssText += 'margin: 0px 0px 0px 0px !important; width: 54% !important;';
                // 调整充电和关注按钮
                /*
                调整充电和关注按钮与头像平齐:位置布局[margin]对其位置[float]
                调整充电和关注按钮高度和宽度:高度[height]宽度[width]右侧距离[margin-right]
                */
                // 整体
                document.getElementsByClassName('btn-panel')[0].style.cssText += 'margin: -42px 0px 0px 0px !important; float: right !important; height: 48px !important;';
                // 关注按钮
                document.getElementsByClassName('default-btn follow-btn btn-transition b-gz')[0].style.cssText += 'width: 120px !important; margin-right: 10px !important; height: 48px !important;';
                // 充电按钮
                if (document.getElementsByClassName('default-btn charge-btn btn-transition')[0]) {
                    document.getElementsByClassName('default-btn charge-btn btn-transition')[0].style.cssText += 'width: 70px !important; height: 48px !important;';
                }
            }
            // 
            // 额外循环判断底部横线颜色
            var borderColorCheckEtime = 0;
            var borderColorCheckForeverSwitch = 0;
            borderColorCheck();
            function borderColorCheck() {
                function borderColorCheckFunction() {
                    // 判断自定义的横线和标准横线的颜色是否一致,如果不一致则改为一致
                    // 标题栏的横线颜色
                    document.getElementsByClassName('video-info-v1')[0].style.cssText += 'border-bottom-color: ' + document.getElementsByClassName('s_tag-v1')[0].style.borderBottomColor + ' !important;';
                    // 头像栏的横线颜色
                    if (!document.getElementsByClassName('members-info-v1')[0]) {
                        document.getElementsByClassName('up-info-v1')[0].style.cssText += 'border-bottom-color: ' + document.getElementsByClassName('s_tag-v1')[0].style.borderBottomColor + ' !important;';
                    } else {
                        document.getElementsByClassName('members-info-v1')[0].style.cssText += 'border-bottom-color: ' + document.getElementsByClassName('s_tag-v1')[0].style.borderBottomColor + ' !important;';
                    }
                }
                if (document.getElementsByClassName('video-info-v1')[0].style.borderBottomColor
                    != document.getElementsByClassName('s_tag-v1')[0].style.borderBottomColor) {
                    borderColorCheckFunction();
                    // 开启永久循环判断
                    borderColorCheckForeverSwitch = 1;
                } else {
                    borderColorCheckEtime = borderColorCheckEtime + 100;
                    if (borderColorCheckEtime >= 8000) {
                        borderColorCheckFunction();
                        // 开启永久循环判断
                        borderColorCheckForeverSwitch = 1;
                    } else {
                        setTimeout(borderColorCheck, 100);
                    }
                    if (borderColorCheckForeverSwitch == 1) {
                        borderColorCheckFunction();
                        // 每隔一段时间判断一次
                        setTimeout(borderColorCheck, 1000);
                    }
                }
            }
        }
        window.scrollTo(0, 0);
    }
})();