查看B站用户高清头像 可自由配置
当前为
// ==UserScript== // @name 查看B站用户高清头像 // @namespace https://github.com/YouMoeYi // @email [email protected] // @version 1.0 // @description 查看B站用户高清头像 可自由配置 // @author YouMoeYi // @match https://space.bilibili.com/* // @grant none // @icon data:image/x-icon;base64,AAABAAEAICAAAAEAIACoEAAAFgAAACgAAAAgAAAAQAAAAAEAIAAAAAAAABAAABMLAAATCwAAAAAAAAAAAAD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A1qEAANahAADWoQAG1qEAb9ahAMvWoQD01qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD01qEAy9ahAG/WoQAG1qEAANahAADWoQAA1qEAG9ahAM/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahANDWoQAb1qEAANahAAfWoQDQ1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahANHWoQAH1qEAbtahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAG7WoQDH1qEA/9ahAP/WoQD/1qEAtdahABjWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahABvWoQC11qEA/9ahAP/WoQD/1qEAx9ahAPnWoQD/1qEA/9ahAP/WoQAZ1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahABjWoQD/1qEA/9ahAP/WoQDz1qEA/9ahAP/WoQD/1qEA/9ahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEAANahAADWoQAA1qEAANahAErWoQDn1qEA5NahAErWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAErWoQDn1qEA5NahAErWoQAA1qEAANahAADWoQAA1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQAA1qEAANahAADWoQAA1qEA5tahAP/WoQD/1qEA59ahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEA5tahAP/WoQD/1qEA59ahAADWoQAA1qEAANahAADWoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAADWoQAA1qEAANahAADWoQD/1qEA/9ahAP/WoQD/1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQD/1qEA/9ahAP/WoQD/1qEAANahAADWoQAA1qEAANahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEAANahAADWoQAA1qEAANahAP/WoQD/1qEA/9ahAP/WoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAP/WoQD/1qEA/9ahAP/WoQAA1qEAANahAADWoQAA1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQAA1qEAANahAADWoQAA1qEA5tahAP/WoQD/1qEA5tahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEA5tahAP/WoQD/1qEA5tahAADWoQAA1qEAANahAADWoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAADWoQAA1qEAANahAADWoQBJ1qEA5tahAObWoQBJ1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQBJ1qEA5tahAObWoQBJ1qEAANahAADWoQAA1qEAANahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQD/1qEA/9ahAP/WoQD/1qEA+dahAP/WoQD/1qEA/9ahABnWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAGdahAP/WoQD/1qEA/9ahAPjWoQDH1qEA/9ahAP/WoQD/1qEAttahABnWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahABnWoQC21qEA/9ahAP/WoQD/1qEAx9ahAG3WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQBt1qEABtahAM/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA0NahAAfWoQAA1qEAG9ahAM/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAM/WoQAb1qEAANahAADWoQAA1qEABtahAG7WoQDH1qEA89ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA89ahAMfWoQBu1qEABtahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEADtahAMXWoQD/1qEA/9ahAP/WoQD/1qEAxdahAA/WoQAA1qEAANahAADWoQAA1qEADtahAMXWoQD/1qEA/9ahAP/WoQD/1qEAxdahAA/WoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAAbWoQDF1qEA/9ahAP/WoQD/1qEA/9ahAMXWoQAP1qEAANahAADWoQAA1qEAANahAADWoQAA1qEADtahAMXWoQD/1qEA/9ahAP/WoQD/1qEAxdahAAbWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAYtahAP/WoQD/1qEA/9ahAP/WoQDF1qEADtahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEADtahAMXWoQD/1qEA/9ahAP/WoQD/1qEAY9ahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQBf1qEA/9ahAP/WoQD/1qEAxdahAA7WoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEADtahAMXWoQD/1qEA/9ahAP/WoQBf1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAATWoQCg1qEA6tahAKjWoQAO1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEAANahAADWoQAA1qEADtahAKjWoQDr1qEAoNahAATWoQAA1qEAANahAADWoQAA1qEAAP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A///////////AAAADgAAAAQAAAAAAAAAAA///wAf//+AP///wD///8A////AP///wDw/w8A8P8PAPD/DwDw/w8A8P8PAPD/DwD///8A////AH///gA///wAAAAAAAAAAAgAAAAcAAAAP8A8A/+AfgH/gP8B/4H/gf+D/8H/////8= // ==/UserScript== (function () { 'use strict'; // 控制台运行提示 console.log('查看B站用户高清头像脚本努力运行中~~~ 作者: YouMoeYi ') // 配置 const config = { // 是否在新标签页打开头像 推荐 false isOpenInNewTab: false, // 高清头像的大小 单位px 推荐 480/360/240 hdAvatarSize: 360, // 警告文本前缀 alertTextPrefix: '查看B站用户高清头像脚本: ', // 脚本创建的节点的ID和类的前缀 (以防和原页面重复) scriptNodeIdOrClassPrefix: '' } // 工具函数 // 判断一个变量是否是对象(而不是数组) function isTrueObject(any) { if (typeof any === 'object' && !Array.isArray(any)) { return true } else { return false } } // 判断一个对象是否为空 function isEmptyObject(obj) { if (isTrueObject(obj)) { if (Object.keys(obj).length === 0) { return true } else { return false } } else { return false } } // 弹出警告框并抛出错误 function alterThenThrow(message) { alert(config.alertTextPrefix + message) throw new Error(message) } // 修改元素节点的css样式 function css(element, config) { if (isTrueObject(config) && !isEmptyObject(config)) { for (let key in config) { element.style[key] = config[key] } } else { alterThenThrow('css函数参数错误') } } // 拆分的小块 // 隐藏高清头像 function hideHdAvatar() { css(document.getElementById('hd-avatar-back-mask-layer'), { display: 'none' }) css(document.getElementById('hd-avatar-div'), { display: 'none' }) } // 显示高清头像 function showHdAvatar() { css(document.getElementById('hd-avatar-back-mask-layer'), { display: 'block' }) css(document.getElementById('hd-avatar-div'), { display: 'block' }) } // 页面加载完 正式运行脚本 window.onload = function () { // 获取相应的DOM节点 const userInfoDiv = document.querySelector('.h-basic div') const avatarImg = document.querySelector('#h-avatar') // 获取头像URL let avatarImgUrl = avatarImg.src let avatarImgUrlWithoutZoom = avatarImgUrl.split('@')[0] // 创建查看头像按钮 let inspectAvatarButton = document.createElement('div') // 配置查看头像按钮的属性和样式 inspectAvatarButton.id = 'inspect-avatar-button' inspectAvatarButton.innerText = '查看头像' css(inspectAvatarButton, { display: 'inline-block', height: '16px', 'line-height': '16px', 'border-radius': '4px', 'font-size': '12px', color: '#fff', padding: '0 5px', 'background-color': '#f45a8d', 'vertical-align': 'middle', 'margin-left': '5px', cursor: 'pointer' }) // 将查看头像按钮插入进用户信息div中 userInfoDiv.appendChild(inspectAvatarButton) // 高清头像是否插入DOM中 let isHdImageInserted = false // 为查看头像按钮绑定click事件 inspectAvatarButton.addEventListener('click', function () { // 如果配置为在新窗口打开高清头像 if (config.isOpenInNewTab) { window.open(avatarImgUrlWithoutZoom, '_blank') } else { // 如果配置为在当前窗口打开高清头像 // 如果高清头像还没插入DOM中时 if (!isHdImageInserted) { // 将高清头像插入DOM // 创建并配置遮罩层 let maskLayer = document.createElement('div') maskLayer.id = 'hd-avatar-back-mask-layer' css(maskLayer, { 'z-index': '99998', position: 'fixed', top: '0', left: '0', width: document.documentElement.clientWidth + 'px', height: document.documentElement.clientHeight + 'px', backgroundColor: 'rgba(0, 0, 0, 0.3)' }) // 为遮罩层绑定click事件 maskLayer.addEventListener('click', function () { hideHdAvatar() }) // 创建并配置高清头像div (容器) let hdAvatarDiv = document.createElement('div') hdAvatarDiv.id = 'hd-avatar-div' css(hdAvatarDiv, { 'z-index': '99999', position: 'fixed', 'margin-top': `calc(50vh - ${config.hdAvatarSize / 2}px)`, 'margin-left': `calc(50vw - ${config.hdAvatarSize / 2}px)`, width: config.hdAvatarSize + 'px', height: config.hdAvatarSize + 'px', }) // 创建并配置高清头像img let hdAvatarImg = document.createElement('img') hdAvatarImg.src = avatarImgUrlWithoutZoom css(hdAvatarImg, { width: config.hdAvatarSize + 'px', height: config.hdAvatarSize + 'px', position: 'fixed', border: '0.6px solid rgba(0, 0, 0, 0.6)' }) // 高清头像img装载进div hdAvatarDiv.appendChild(hdAvatarImg) // 高清头像右上角叉的base64编码 const unfocusedCloseButtonSrc = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABMAAAASCAYAAAC5DOVpAAAACXBIWXMAAAsTAAALEwEAmpwYAAAGrGlUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS42LWMxNDIgNzkuMTYwOTI0LCAyMDE3LzA3LzEzLTAxOjA2OjM5ICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtbG5zOnN0RXZ0PSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VFdmVudCMiIHhtbG5zOnhtcD0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLyIgeG1sbnM6ZGM9Imh0dHA6Ly9wdXJsLm9yZy9kYy9lbGVtZW50cy8xLjEvIiB4bWxuczpwaG90b3Nob3A9Imh0dHA6Ly9ucy5hZG9iZS5jb20vcGhvdG9zaG9wLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDozQjk3QUY1OEZBNUJFMzExQjExOTg2REFEMkRFM0JFMyIgeG1wTU06RG9jdW1lbnRJRD0iYWRvYmU6ZG9jaWQ6cGhvdG9zaG9wOmE1MGFlMWZjLThjYzQtMTc0ZS1iYTQyLThhYjYwM2YzOGQ3ZiIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo2MzA5MThjNy02ZjRjLTdmNGUtYTg3Yi05YmMwYmE1NDRmYjkiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNSIgeG1wOkNyZWF0ZURhdGU9IjIwMjEtMDMtMTlUMjI6MzM6MjYrMDg6MDAiIHhtcDpNb2RpZnlEYXRlPSIyMDIxLTAzLTE5VDIyOjM1KzA4OjAwIiB4bXA6TWV0YWRhdGFEYXRlPSIyMDIxLTAzLTE5VDIyOjM1KzA4OjAwIiBkYzpmb3JtYXQ9ImltYWdlL3BuZyIgcGhvdG9zaG9wOkNvbG9yTW9kZT0iMyIgcGhvdG9zaG9wOklDQ1Byb2ZpbGU9InNSR0IgSUVDNjE5NjYtMi4xIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MUU3NzQwNTYwQTVDRTMxMTk5MUZCNjY5N0M1Qjg0RDUiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6M0I5N0FGNThGQTVCRTMxMUIxMTk4NkRBRDJERTNCRTMiLz4gPHhtcE1NOkhpc3Rvcnk+IDxyZGY6U2VxPiA8cmRmOmxpIHN0RXZ0OmFjdGlvbj0ic2F2ZWQiIHN0RXZ0Omluc3RhbmNlSUQ9InhtcC5paWQ6MjZiZmE4NzQtOGMwMC0zZDRmLWIxMWQtN2NlYzFhNjAzYTI1IiBzdEV2dDp3aGVuPSIyMDIxLTAzLTE5VDIyOjM1KzA4OjAwIiBzdEV2dDpzb2Z0d2FyZUFnZW50PSJBZG9iZSBQaG90b3Nob3AgQ0MgKFdpbmRvd3MpIiBzdEV2dDpjaGFuZ2VkPSIvIi8+IDxyZGY6bGkgc3RFdnQ6YWN0aW9uPSJzYXZlZCIgc3RFdnQ6aW5zdGFuY2VJRD0ieG1wLmlpZDo2MzA5MThjNy02ZjRjLTdmNGUtYTg3Yi05YmMwYmE1NDRmYjkiIHN0RXZ0OndoZW49IjIwMjEtMDMtMTlUMjI6MzUrMDg6MDAiIHN0RXZ0OnNvZnR3YXJlQWdlbnQ9IkFkb2JlIFBob3Rvc2hvcCBDQyAoV2luZG93cykiIHN0RXZ0OmNoYW5nZWQ9Ii8iLz4gPC9yZGY6U2VxPiA8L3htcE1NOkhpc3Rvcnk+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+bWcI6wAAAHBJREFUOI3N1FEOgDAIA1Dq/e9cv0zmBi2amcg3eYEBA8nYFcc26VMMAAG0+s5ybxhJXIkOGvNTrANWUIopUEElloEOioiA27OxOgXJyt6ExObW3JRLbIY6YIpVj+3ABXNTU+ByTgpyoF2NJ/HfL+gEDzRWIzgJEQgAAAAASUVORK5CYII=' const focusedCloseButtonSrc = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABMAAAASCAIAAAA2bnI+AAAACXBIWXMAAAsTAAALEwEAmpwYAAAGuGlUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS42LWMxNDIgNzkuMTYwOTI0LCAyMDE3LzA3LzEzLTAxOjA2OjM5ICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtbG5zOnN0RXZ0PSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VFdmVudCMiIHhtbG5zOnhtcD0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLyIgeG1sbnM6ZGM9Imh0dHA6Ly9wdXJsLm9yZy9kYy9lbGVtZW50cy8xLjEvIiB4bWxuczpwaG90b3Nob3A9Imh0dHA6Ly9ucy5hZG9iZS5jb20vcGhvdG9zaG9wLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDozQjk3QUY1OEZBNUJFMzExQjExOTg2REFEMkRFM0JFMyIgeG1wTU06RG9jdW1lbnRJRD0iYWRvYmU6ZG9jaWQ6cGhvdG9zaG9wOjEwNjJhM2ZmLTc2MDktN2M0Ny04MDYyLThiMmIzNWQ2ZDlkZSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDpjOTJhMGVmMC0yZGYxLTAyNDEtODBiZi03YTMwMTk0MDllYWMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNSIgeG1wOkNyZWF0ZURhdGU9IjIwMjEtMDMtMTlUMjI6MzM6MjYrMDg6MDAiIHhtcDpNb2RpZnlEYXRlPSIyMDIxLTAzLTE5VDIyOjM1OjUzKzA4OjAwIiB4bXA6TWV0YWRhdGFEYXRlPSIyMDIxLTAzLTE5VDIyOjM1OjUzKzA4OjAwIiBkYzpmb3JtYXQ9ImltYWdlL3BuZyIgcGhvdG9zaG9wOkNvbG9yTW9kZT0iMyIgcGhvdG9zaG9wOklDQ1Byb2ZpbGU9InNSR0IgSUVDNjE5NjYtMi4xIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MUU3NzQwNTYwQTVDRTMxMTk5MUZCNjY5N0M1Qjg0RDUiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6M0I5N0FGNThGQTVCRTMxMUIxMTk4NkRBRDJERTNCRTMiLz4gPHhtcE1NOkhpc3Rvcnk+IDxyZGY6U2VxPiA8cmRmOmxpIHN0RXZ0OmFjdGlvbj0ic2F2ZWQiIHN0RXZ0Omluc3RhbmNlSUQ9InhtcC5paWQ6NjQ4NmQ5ZDMtZDk4Ny02ZjQyLWE0ZTQtNGU0NjA3NmRlYmU0IiBzdEV2dDp3aGVuPSIyMDIxLTAzLTE5VDIyOjM1OjUzKzA4OjAwIiBzdEV2dDpzb2Z0d2FyZUFnZW50PSJBZG9iZSBQaG90b3Nob3AgQ0MgKFdpbmRvd3MpIiBzdEV2dDpjaGFuZ2VkPSIvIi8+IDxyZGY6bGkgc3RFdnQ6YWN0aW9uPSJzYXZlZCIgc3RFdnQ6aW5zdGFuY2VJRD0ieG1wLmlpZDpjOTJhMGVmMC0yZGYxLTAyNDEtODBiZi03YTMwMTk0MDllYWMiIHN0RXZ0OndoZW49IjIwMjEtMDMtMTlUMjI6MzU6NTMrMDg6MDAiIHN0RXZ0OnNvZnR3YXJlQWdlbnQ9IkFkb2JlIFBob3Rvc2hvcCBDQyAoV2luZG93cykiIHN0RXZ0OmNoYW5nZWQ9Ii8iLz4gPC9yZGY6U2VxPiA8L3htcE1NOkhpc3Rvcnk+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+rutM1QAAAHJJREFUOI2lkzEOwCAIRdUOOHoTwuj9r+TgRgdNh5bol/6N+J5oAlettbXWew9wSikiEogId574rE9UVVWdwOJse69N7DWTQ7UXvdDiQp5EtJmEPgM0R8PRzfNJs0Q1VHZOwq/pO0vO2WclZj5dNiJi5hsaAn1s2riTjgAAAABJRU5ErkJggg==' // 创建关闭按钮 let closeButton = document.createElement('img') // 设置关闭按钮默认图片和样式 (未聚焦) closeButton.src = unfocusedCloseButtonSrc css(closeButton, { position: 'absolute', top: '10px', right: '10px', width: '18px', height: '18px', cursor: 'pointer' }) // 关闭按钮默认图片聚焦时 closeButton.addEventListener('mouseenter', function () { closeButton.src = focusedCloseButtonSrc }) // 关闭按钮默认图片未聚焦时 closeButton.addEventListener('mouseleave', function () { closeButton.src = unfocusedCloseButtonSrc }) // 点击关闭按钮图片关闭高清头像显示 closeButton.addEventListener('click', function () { hideHdAvatar() }) // 将关闭按钮插入进高清头像div中 hdAvatarDiv.appendChild(closeButton) // 插入遮罩层和高清图片到body中 document.body.prepend(maskLayer) document.body.prepend(hdAvatarDiv) // 插入后更改状态 isHdImageInserted = true } else { // 已经将遮罩层插入DOM 但被隐藏时 点击按钮恢复显示 showHdAvatar() } } }) } })();
