究极美化必应搜索页面（毛玻璃）(原 Bing beautification)
// ==UserScript==
// @name 究极美化必应搜索页面（毛玻璃）(原 Bing beautification)
// @namespace http://tampermonkey.net/
// @version 2.7.16
// @description 美化必应搜索页面
// @author Onion
// @require https://cdn.staticfile.org/jquery/3.4.0/jquery.min.js
// @require https://cdn.staticfile.org/jquery-cookie/1.4.1/jquery.cookie.min.js
// @match *://*.cn.bing.com/*
// @match *://*.bing.com/*
// @match *://*.baidu.com/*
// @icon https://gitee.com/onion-big/gitstore/raw/main/js/jpg/beautify.png
// @license MPL2.0
// @grant GM_notification
// @run-at start
// ==/UserScript==
(function() {
'use strict';
// @require https://greasyfork.org/scripts/453994-bing-beautification-store/code/Bing%20beautification%20store.js
window.addEventListener('error', ()=>{
console.log('addEventListener')
}, true);
//bing域名
if (window.location.href.indexOf("cn.bing.com/search") > -1) {
//config
var picArr = new Array
picArr = [
//bing每日壁纸 索引号0
"https://bing.biturl.top/?resolution=1920&format=image&index=0&mkt=zh-CN",//动态每日壁纸
"https://bing.com/th?id=OHR.NationalDay2022_ZH-CN3861603311_1920x1080.jpg",
"https://bing.com/th?id=OHR.BridgeofSighs_ZH-CN5414607871_1920x1080.jpg",
//Wallpaper Abyss壁纸 索引号3
"https://images4.alphacoders.com/171/171916.jpg",
"https://images5.alphacoders.com/613/613927.jpg",
"https://images2.alphacoders.com/606/606275.jpg",
"https://images2.alphacoders.com/742/742320.png",
//添加你自己的壁纸...... 索引号7
"https://dogefs.s3.ladydaily.com/~/source/wallhaven/full/8o/wallhaven-8o2dpj.png?w=2560&fmt=webp",
"https://bing.biturl.top/?resolution=1920&format=image&index=0&mkt=zh-CN"
]
//全局图片
function fullPicSet() {
//document.querySelector("html").style.background = `url(${$.cookie('picUrl')}) 0% 0% / 111% no-repeat fixed`
document.querySelector("html").style.background = `url(${$.cookie('picUrl')}) 0 / cover fixed`
}
function reset_all() {
$.cookie('blurDeg', "blur(13px)", { expires: 31 })
$.cookie('aDeg1', "53", { expires: 31 })
$.cookie('aDeg2', "7c", { expires: 31 })
$.cookie('picUrl', "https://bing.com/th?id=OHR.NationalDay2022_ZH-CN3861603311_1920x1080.jpg", { expires: 31 })
}
if ($.cookie('blurDeg') === undefined || $.cookie('picUrl') === undefined || $.cookie('aDeg1') === undefined || $.cookie('aDeg1') === undefined) {
reset_all()
alert("欢迎，数值设置格式请看控制台！")
}
if ($.cookie('blurDeg') === "" || $.cookie('picUrl') === "" || $.cookie('aDeg1') === "" || $.cookie('aDeg2') === "") {
reset_all()
alert("欢迎，数值设置格式请看控制台！")
}
console.log("模糊度的范围从0到1000(纯数字),例如:15")
console.log("透明度的范围从00到fc(16进制)，例如:ac")
console.log("图片url网址链接，你可以自己找，或者挂到GitHub上生成链接")
console.log("低配机子请设置模糊度为0")
//选择器
var searchBox = document.getElementsByClassName("b_searchbox")[0];
var searchboxForm = document.getElementsByClassName("b_searchboxForm")[0];
var temp = document.getElementById('b_content');
var temp2 = document.getElementById('b_results');
var temp3 = document.getElementById('b_header');
var b_rrsr = document.getElementsByClassName('b_rrsr');
var tab1 = document.getElementsByClassName("tab-menu");
var b_algo = document.getElementsByClassName('b_algo');
var trans1 = document.getElementsByClassName('b_title');
var b_context = document.getElementById('b_context');
var slide = document.getElementsByClassName("slide")
var nws_cwrp = document.getElementsByClassName("nws_cwrp")
var liChildren = document.getElementById('b-scopeListItem-video')
// var lifontSize = window.getComputedStyle(liChildren).fontSize //获取fontSize 的方法，常规方法获得的是0因为由字体定义而来
var b_ans = document.getElementsByClassName('b_ans');
var b_bfb_mainline = document.getElementsByClassName('b_bfb_mainline b_ans')[0]
var sb_form_q = document.getElementById('sb_form_q')
var b_header = document.getElementById('b_header')
var b_scopebar = document.getElementsByClassName("b_scopebar");
var qna_algo=document.getElementsByClassName('qna_algo')
var tab_head_HeroTab = document.getElementsByClassName('HeroTab')
var length1
if(b_context){
length1= b_context.children.length
}
// header背景
// b_context.children[length1 - 1].style.display = "none";
function header_bg() {
b_header.children[0].style.background = "linear-gradient(to right, rgb(255, 221, 238), skyblue) 0% 0% / 100% fixed"
b_header.children[0].children[0].style.background = "linear-gradient(to right, rgb(255, 221, 238), skyblue) 0% 0% / 100% fixed"
b_header.children[0].children[1].style.background = "linear-gradient(to right, rgb(255, 221, 238), skyblue) 0% 0% / 100% fixed"
}
function creatBox() {
var div = document.createElement("div");
//为div创建属性class = "test"
var divattr = document.createAttribute("id");
divattr.value = "settings";
//把属性class = "test"添加到div
div.setAttributeNode(divattr);
//创建一个值为test的按钮
var input = document.createElement("input");
var inputattr = document.createAttribute("type");
inputattr.value = "button";
input.setAttributeNode(inputattr);
var inputattr1 = document.createAttribute("value");
inputattr1.value = "test";
input.setAttributeNode(inputattr1);
//创建一hello,world个文本节点
var text = document.createTextNode("settings");
//将按钮和文本节点追加到div
div.appendChild(input);
div.appendChild(text);
//为div添加样式
var style = document.createAttribute("style");
div.setAttributeNode(style);
div.style.backgroundColor = "rgb(255 255 255 / 70%)";
div.style.borderWidth = "20px";
div.style.width = "500px";
div.style.height = "580px";
//把div追加到body
b_scopebar[0].appendChild(div)
document.getElementById("settings").style = `
backdrop-filter: blur(30px);
background-color: rgba(255, 255, 255, 0);
border-color: rgb(0, 0, 0);
width: 22%;height: 248%;
position: absolute;
top: 112%;
left: 43%;z-index: 9;
border-radius: 10px;
animation-name: fadeIn;
-webkit-animation-duration: 0.6s;
-webkit-animation-timing-function: cubic-bezier(0, 1.15, 1, 1);
-webkit-animation-delay: 0s;
-webkit-animation-iteration-count: 1;
`
/* */
var css_innerBox = `
position: absolute;
top: 0%;
left: 0%;
bottom: 0%;
right: 0%;
background-color: rgb(144 144 144 / 48%);
z-index: 9;
height: 100%;
width: 100%;
margin: auto;
border-radius: 10px;`
var css_input = `
width: 80%;
height: 27px;
border-radius: 10px;`
var css_set = `margin: 10px 18px;`
var css_button = `background:transparent;border-radius: 4px;float:right;`
var css_move_it = ` translate:50%;float: right;`
var css_top_move = `width:100%;height:100%`
document.getElementById("settings").innerHTML = `<div id="settings1">
<div id="innerBox" style="${css_innerBox}">
<div class="set" id="first_div" style="${css_set}"><span id="top_move" style="${css_top_move}">模糊度(1~100)图片模式</span> <span id="move_it" style="${css_move_it}">X</span><br><input style="${css_input}" class="input_set" type="text"></input></div>
<div class="set" style="${css_set}">透明度1(00~ff)渐变色模式<br><input style="${css_input}" class="input_set" class="input_set" type="text"></input></div>
<div class="set" style="${css_set}">透明度2(00~ff)图片模式<br><input style="${css_input}" class="input_set" class="input_set" type="text"></input></div>
<div class="set" style="${css_set}">图片URL<br><input style="${css_input}" class="input_set" class="input_set" type="text"></input></div>  
<button id="confirm_button" style="${css_button}">确认</button>
</div>
</div>
`
//插入渲染完成
var settings = document.getElementById("settings")
var confirm_button = document.getElementById("confirm_button")
var input_set = document.getElementsByClassName('input_set')
settings.style.display = "none"
confirm_button.addEventListener('click', () => {
if (input_set[3].value === "" || input_set[2].value === "" || input_set[1].value === "" || input_set[0].value === "") {
reset_all();
GM_notification({
text: '数值不能为空！已全部重置为默认值',
timeout: 3000,
});
}
else {
$.cookie('blurDeg', `blur(${input_set[0].value}px)`, { expires: 31 })
$.cookie('aDeg1', `${input_set[1].value}`, { expires: 31 })
$.cookie('aDeg2', `${input_set[2].value}`, { expires: 31 })
// $.cookie('picUrl',`${input_set[3].value}`,{ expires: 31 })
if (/http/g.test(input_set[3].value)) {
$.cookie('picUrl', input_set[3].value, { expires: 31 })
}
else if (/^\d+$/g.test(input_set[3].value)) {
$.cookie('picUrl', picArr[`${input_set[3].value}`], { expires: 31 })
}
else {
$.cookie('picUrl', input_set[3].value, { expires: 31 })
}
GM_notification({
text: '参数设置已生效！',
timeout: 3000,
});
}
//
location.reload();
})
document.getElementById("move_it").addEventListener('click', () => {
document.getElementById("settings").style.display = "none"
})
}
creatBox()
//移动函数
function move(demo) {
//var demo = document.getElementById(`${settings}`)
var canitmove = false
var x = 0,
y = 0
demo.onmousedown = function (e) {
event.preventDefault()
x = e.pageX - demo.offsetLeft
y = e.pageY - demo.offsetTop
canitmove = true
console.log(e.pageX)
}
window.onmouseup = function () {
canitmove = false
}
window.onmousemove = function (e) {
if (canitmove) {
demo.style.left = e.pageX - x + 'px'
demo.style.top = e.pageY - y + 'px'
}
}
}
// document.getElementById('css_top_move').addEventListener('mouseon')
// 快捷输入与置顶与按键监听
document.onkeydown = function (e) {
var keyNum = window.event ? e.keyCode : e.which;
// alert(keyNum)
// console.log(e)
if (191 == keyNum && e.ctrlKey) {
e.preventDefault();
if (document.getElementById('mfa_srch')) {
document.getElementById('mfa_srch').click()
}
}
if (13 == keyNum) {
if (document.getElementById("settings").style.display == "block") {
document.getElementById("confirm_button").click()
}
}
}
//结果框背景色函数
function changeBack_All(deg, deg2) {
changeBack_1(deg, deg2);
changeBack_2(deg, deg2);
}
function changeBack_1(deg, deg2) {
for (let k = 0; k <= b_ans.length - 1; k++) {
b_ans[k].style.borderRadius = "10px";
b_ans[k].style.background = `#ffffff${deg}`
b_ans[k].style.backdropFilter = `${deg2}`
}
}
function changeBack_2(deg, deg2) {
for (let i = 0; i <= b_algo.length - 1; i++) {
b_algo[i].style.borderRadius = "10px";
b_algo[i].style.background = `#ffffff${deg}`
b_algo[i].style.caretColor = "transparent";
b_algo[i].style.backdropFilter = `${deg2}`
// b_algo[i].addEventListener("mouseover", b_algo[i].style.boxShadow="0 6px 20px 0 rgb(0 0 0 /30%)")
}
}
function searchStyle() {
if (b_bfb_mainline) {
b_bfb_mainline.style.borderRadius = "10px"
}
if (b_rrsr[0]) {
for (let k = 0; k <= b_rrsr.length - 1; k++) {
// b_rrsr[k].style.borderRadius="10px";
b_rrsr[0].style.background = "transparent";
}
}
if (tab1.length > 0) {
for (let i = 0; i <= tab1[0].children[0].children.length - 1; i++) {
tab1[0].children[0].children[i].style.backgroundColor = ("transparent");
}
}
for (let i = 0; i <= trans1.length - 1; i++) {
trans1[i].style.translate = "23px"; //这一句有报错，但是我看不懂
}
// searchBox.style.setProperty('width', '480px', 'important');
searchBox.style.transition = "all 0.5s"
}
function move1() {
searchBox.onmousedown = function () {
searchBox.style.width = "77vh";
}
}
temp.onmousedown = function () {
searchBox.style.width = "522px";
}
// $.cookie('flag', '0')
var button_1 = document.createElement("button"); //创建一个按钮
button_1.textContent = "透明"; //按钮内容
button_1.style.width = "60px"; //按钮宽度
button_1.style.height = "30px"; //按钮高度
button_1.style.align = "center"; //居中
button_1.style.color = "#444444"; //按钮文字颜色
button_1.style.border = "none"; //按钮文字颜色
button_1.style.background = "transparent"; //按钮底色
button_1.style.fontSize = "12px"
button_1.style.padding = "9.3px 0"
button_1.addEventListener("click", clickButton_1)
function clickButton_1() {
searchboxForm.style.background = `#ffffff${$.cookie('aDeg2')}`
$.cookie('flag', '1')
}
if ($.cookie('flag') == 1) {
searchboxForm.style.background = `#ffffff${$.cookie('aDeg2')}`
}
var button_2 = document.createElement("button"); //创建一个按钮
button_2.textContent = "炫彩"; //按钮内容
button_2.style.width = "60px"; //按钮宽度
button_2.style.height = "30px"; //按钮高度
button_2.style.align = "center"; //居中
button_2.style.color = "#444444"; //按钮文字颜色
button_2.style.border = "none"; //按钮文字颜色
button_2.style.background = "transparent"; //按钮底色
button_2.style.fontSize = "12px"
button_2.style.padding = "9.3px 0"
button_2.addEventListener("click", clickButton_2)
function clickButton_2() {
searchboxForm.style.backgroundImage = "linear-gradient(to right, rgb(255, 221, 238), skyblue)";
$.cookie('flag', '1')
}
if ($.cookie('flag') == 2) {
searchboxForm.style.backgroundImage = "linear-gradient(to right, rgb(255, 221, 238), skyblue)";
}
var button_3 = document.createElement("button"); //创建一个按钮
button_3.textContent = "换背景"; //按钮内容
button_3.style.width = "60px"; //按钮宽度
button_3.style.height = "30px"; //按钮高度
button_3.style.align = "center"; //居中
button_3.style.color = "#444444"; //按钮文字颜色
button_3.style.border = "none"; //按钮文字颜色
button_3.style.background = "transparent"; //按钮底色
button_3.style.fontSize = "12px"
button_3.style.padding = "9.3px 0"
button_3.addEventListener("click", clickButton_3)
button_3.addEventListener("dblclick", dblclickButton_3)
if ($.cookie('bgFlag') == undefined) {
$.cookie('bgFlag', '3', { expires: 31 })//如果空则默认渐变色
}
function clickButton_3() {//图片背景
$.cookie('bgFlag', '4', { expires: 31 })
temp.style.background = `url(${$.cookie('picUrl')}) 0 / cover fixed`
// temp.style.backgroundAttachment = "fixed"
// temp.style.backgroundSize = "100%"
changeBack_All(`${$.cookie('aDeg2')}`, `${$.cookie('blurDeg')}`)
// temp.style.translate=""
}
function dblclickButton_3() {//渐变色背景
$.cookie('bgFlag', '3', { expires: 31 })
temp.style.backgroundImage = "linear-gradient(to right, #FFDDEE , skyblue)";
temp.style.backgroundAttachment = "fixed"
changeBack_All(`${$.cookie('aDeg1')}`, "none")
// temp.style.translate="0px -2px"
}
if ($.cookie('bgFlag') == 4) {//图片背景
temp.style.background = `url(${$.cookie('picUrl')}) 0 / cover fixed`
// temp.style.backgroundAttachment = "fixed"
// temp.style.backgroundSize = "100%"
changeBack_All(`${$.cookie('aDeg2')}`, `${$.cookie('blurDeg')}`)
// temp.style.translate=""
}
if ($.cookie('bgFlag') == 3) {//渐变色背景
temp.style.backgroundImage = "linear-gradient(to right, #FFDDEE , skyblue)";
temp.style.backgroundAttachment = "fixed"
changeBack_All(`${$.cookie('aDeg1')}`, "none")
// temp.style.translate="0px -2px"
}
var button_4 = document.createElement("button"); //创建一个按钮
button_4.textContent = "⚙"; //按钮内容
button_4.style.width = "60px"; //按钮宽度
button_4.style.height = "30px"; //按钮高度
button_4.style.align = "center"; //居中
button_4.style.color = "#444444"; //按钮文字颜色
button_4.style.border = "none"; //按钮文字颜色
button_4.style.background = "transparent"; //按钮底色
button_4.style.fontSize = "20px"
button_4.style.padding = "9.3px 0"
button_4.addEventListener("click", clickButton_4)
function clickButton_4() {
document.getElementById("settings").style.display = "block"
let regex = /(?<=\().*?(?=\))/g;
let regex_num = /\d+/g
let blurIndex = $.cookie('blurDeg')
blurIndex = blurIndex.match(regex)[0].match(regex_num)[0]
document.getElementsByClassName('input_set')[0].value = `${blurIndex}`
document.getElementsByClassName('input_set')[1].value = `${$.cookie('aDeg1')}`
document.getElementsByClassName('input_set')[2].value = `${$.cookie('aDeg2')}`
document.getElementsByClassName('input_set')[3].value = `${$.cookie('picUrl')}`
}
b_scopebar[0].children[0].appendChild(button_1);
b_scopebar[0].children[0].appendChild(button_2);
b_scopebar[0].children[0].appendChild(button_3);
document.getElementById('id_h').appendChild(button_4);
//搜索关联盒子长度溢出解决
function fixOverflow(relatedBox) {
if (relatedBox) {
for (let i = 0; i <= relatedBox.children[0].children[1].children.length - 1; i++) {
relatedBox.children[0].children[1].children[i].style.width = "45%"
}
}
}
function fixOverflow2() {
var brsv3 = document.getElementById('brsv3')
if (brsv3) {
for (let i = 0; i <= brsv3.children[1].children.length - 1; i++) {
brsv3.children[1].children[i].style.width = "45%"
}
}
}
function remove_foot() {
var length_b_canvas = document.getElementsByClassName('b_canvas').length
if (document.getElementsByClassName('b_canvas')[0]) {
// Todo 选择器重叠，不能用b_canvas找，待修复
// document.getElementsByClassName('b_canvas')[document.getElementsByClassName('b_canvas').length - 1].style.display = "none"
}
if (document.getElementById('b_footer')) {
document.getElementById('b_footer').style.background = "#000000e8"
document.getElementById('b_footer').style.translate = "0px 0px"
}
if (document.getElementById('mfa_srch')) {
document.getElementById('mfa_srch').style.backdropFilter = "blur(10px)"
document.getElementById('mfa_srch').style.background = "transparent"
}
}
function fixotherQues() {
//qna_algo 白溢出问题
if(qna_algo){
for(let i=0;i<=qna_algo.length-1;i++){
qna_algo[i].children[0].style=""
}
}
//tab_head_HeroTab 百科推荐栏
/* if(tab_head_HeroTab[0]){
if(tab_head_HeroTab[0].children){
tab_head_HeroTab[0].children[0].style.background="transparent"
tab_head_HeroTab[0].children[2].style.background="transparent"
}
}*/
for (let i = 0; i <= slide.length - 1; i++) {
slide[i].children[0].style.background = "transparent"
}
if (nws_cwrp[0]) {
nws_cwrp[0].style.background = "transparent"
}
if (document.getElementsByClassName("mc_vhvc_th")[0]) {
document.getElementsByClassName("mc_vhvc_th")[0].children[0].style.background = "transparent"
document.getElementsByClassName("mc_vhvc_th")[1].children[0].style.background = "transparent"
// document.getElementsByClassName("mc_vhvc_th")[2].children[0].style.background="transparent"
}
if (document.getElementsByClassName("na_ccw")) {
for (let i = 0; i <= document.getElementsByClassName("na_ccw").length - 1; i++) {
document.getElementsByClassName("na_ccw")[i].style.background = "transparent"
}
console.log('渲染完成！')
}
else (console.log("渲染部分失败！"))
}
////////////////////css
const runkeyframes = `
@keyframes fadeIn {
0% {
opacity: 0;
/*初始状态 透明度为0*/
}
50% {
opacity: 0;
/*中间状态 透明度为0*/
}
100% {
opacity: 1;
/*结尾状态 透明度为1*/
}
}
.pagereco_CB{
background-color: transparent;
}
.pagereco_CBImageCard, .pagereco_CBTextCard{
background-color: #fff0;
}
#tabcontrol_8_156412_navr{
background-color: transparent;
}
#b_header{
border-bottom: none;
}
#lMapContainer{
background:transparent;
border:none;
}
/*网页border*/
.b_algoSlug .algoSlug_icon{
border:none;
}
/*footer*/
#b_PagAboveFooter{
background:transparent;
}
/*其他脚本*/
#dsdsd99mmmjj7760011{
background:#ffffff${$.cookie('aDeg2')};
border-radius: 10px;
margin: 1px 0px;
width: 472px;
translate: -21px;
display: flex;
flex-direction: column;
backdrop-filter: ${$.cookie('blurDeg')};
}
/*translate*/
.tta_incell{
background:transparent;
}
.tta_outcell{
background:transparent;
}
#tta_output_ta{
background:transparent;
}
/自适应布局/
/*@media (max-width: 320px) {
/*0~320*/
html {
background-size: 10%;
}
#temp{
background-size:111%;
}
}
@media (min-width: 321px) and (max-width: 375px) {
/*321~768*/
html {
background-size: 20%;
}
#temp{
background-size:111%;
}
}
@media (min-width: 376px) and (max-width: 425px) {
/*376~425*/
html {
background-size: 30%;
}
#temp{
background-size:111%;
}
}
@media (min-width: 426px) and (max-width: 768px) {
/*426~768*/
html {
background-size: 40%;
}
#temp{
background-size:111%;
}
}
@media (min-width: 769px) {
/*769~+∞*/
html {
background-size: 100%;
}
#temp{
background-size:111%;
}
}
*/
`
// 创建style标签
const style = document.createElement('style');
// 设置style属性
style.type = 'text/css';
// 将 keyframes样式写入style内
style.innerHTML = runkeyframes;
// 将style样式存放到head标签
document.getElementsByTagName('body')[0].appendChild(style);
////////////////////
function doIt() {
fixotherQues();
fixOverflow();
fixOverflow2();
remove_foot();
move1();
searchStyle();
fullPicSet(); //搜索栏背景
}
doIt();
}
if (window.location.href.indexOf("baidu.com") > -1) {
var picUrl = `https://dogefs.s3.ladydaily.com/~/source/wallhaven/full/8o/wallhaven-8o2dpj.png?w=2560&fmt=webp`
$.cookie('picUrl', picUrl)
document.getElementById('wrapper_wrapper').style.background = `url(${$.cookie('picUrl')}) 0% 0% / 100% no-repeat fixed`
}
})();