一行代码让网页自动变黑白(哀悼模式)

作者: 去年夏天 分类: 技术文章 发布时间: 2022-12-03 17:31

❈一行代码让网页自动变黑白(哀悼模式)

在指定日期自动使网页变黑白的脚本


其实原理特别简单,就是CSS3 的 filter(滤镜)属性,直接上个黑白滤镜

document.body.style.filter = 'grayscale(1)'

基本上除了天国的IE酱不能兼容,其他主流浏览器都可以支持这个属性了。
PS:你应该也知道怎么解除黑白了吧,反向操作一下就好了。

脚本如下

var e;
e = function() {
    const e = window.MOURNING_MODEDATE_LIST || ["7/7", "9/18", "11/30", "12/13"];
    window.addEventListener("load", (function() {
        const n = `$ { (new Date).getMonth() + 1}/${(new Date).getDate()}`;
e.some((e=>e===n))&&(document.body.style.filter="grayscale(1)")}))},"function"==typeof define&&define.amd?define(e):e();
// #sourceMappingURL = index.browser.js.map

一目了然,就4个日子

    '7/7', // 七七事变
    '9/18', // 九一八事变
    '11/30', // 长者祭日
    '12/13', // 国家公祭日

CDN版:

<   script src="https://fastly.jsdelivr.net/gh/tjsky/tjsky@main/mourn.js"></script>

参考:https://github.com/CaoMeiYouRen/mourning-mode

发表回复

您的电子邮箱地址不会被公开。 必填项已用*标注

此站点使用Akismet来减少垃圾评论。了解我们如何处理您的评论数据