前言

之前有人对必应壁纸下手了,获取了必应壁纸的链接,将其用于博客背景上面,但是,刷新之后不能更换,这不就浪费了必应每日的六张壁纸图片吗?

前段时间有人做出了可以刷新更换的必应壁纸的JS代码,我将其经授权之后拿来使用,并且有所改动,但忘记了来源。

如果相关代码有侵权,请联系删除

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
$(document).ready(function () {
var url = 'https://bird.ioliu.cn/v1/?url=https://www.bing.com/HPImageArchive.aspx?format=js&idx=0&n=8';
var imgUrls = JSON.parse(sessionStorage.getItem("imgUrls"));
var index = sessionStorage.getItem("index");
var $back = $('#back');
if(imgUrls == null){
imgUrls = new Array();
index = 0;
$.get(url,function (result) {
images = result.images;
for (let i = 0; i < images.length; i++) {
const item = images[i];
imgUrls.push(item.url);
}
var imgUrl = imgUrls[index];
var url = "https://www.bing.com"+imgUrl;
$back.css("background", "linear-gradient( rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5) ),url('"+url+"') center center no-repeat #666");
$back.css("background-size", "cover");
sessionStorage.setItem("imgUrls",JSON.stringify(imgUrls));
sessionStorage.setItem("index",index);
});
}else{
if(index == 7)
index = 0;
else
index++;
var imgUrl = imgUrls[index];
var url = "https://www.bing.com"+imgUrl;
$back.css("background", "linear-gradient( rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5) ),url('"+url+"') center center no-repeat #666");
$back.css("background-size", "cover");
sessionStorage.setItem("index",index);
}
})

使用

如何使用呢?

将该代码引入网页,在网站的中插入以下代码

1
<div id="back" class="background-img"></div>

之后给该背景加一个CSS样式:

1
2
3
4
5
6
7
8
9
10
11
.background-img
{
z-index: -3; /*图层优先级*/
position: fixed; /*位置*/
top: 0;
left: 0;
width: 100%;
height: 100%;
background-size: cover;
filter: blur(1px); /*模糊度*/
}

这样就可以使用了

CSS插入其余背景

但是你不想使用必应壁纸,想使用别的图片作为壁纸,那怎么办?

插入以下代码:

1
2
3
4
body
{
background-image:url('此处填写链接或者相对路径');
}

你还可以增加其余的参数,比如模糊度、位置等参数