每当有重大灾难或意外发生时,各大网站都会变灰,以表达对逝者的哀悼。

每年的12月13日,都是国家公祭日。而今年的12月13日快到了。

1. CSS使网页变灰

废话不多说,见源码:

1
2
3
4
5
6
7
8
9
html{
filter:gray,
filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1),
filter:gray,
-webkit-filter:gray,
-moz-filter:gray,
-ms-filter:gray,
-o-filter:gray
}

2. jQuery使网站自动变灰

1
2
3
4
5
6
7
8
9
10

<script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js">
<script>
//当日期为12月13日时网页变灰
if(new Date().getMonth() == 12 && new Date.getDate() == 13){
//Gray Filter
$("html").css({"filter":'gray',"filter":"progid:DXImageTransform.Microsoft.BasicImage(grayscale=1)","filter":'grayscale(100%)',"-webkit-filter":'grayscale(100%)','-moz-filter':'grayscale(100%)','-ms-filter':'grayscale(100%)','-o-filter':'grayscale(100%)'});
}
</script>

将以上代码加入到博客的模板中,hexo butterfly主题可以直接在主题配置文件中加入。