特定日期全站变灰的js代码-飞翔资源网

温馨提醒

如果文章内容或图片资源失效，请留言反馈，我们会及时处理，谢谢

本文最后更新于2023年11月16日，已超过 180天没有更新

方法一

判断当前日期 + css 的 filter 滤镜，由于要照顾各浏览器的兼容性，css 最好要写全。

<script>
$(document).ready(function() {
    var today = new Date();
    var todayMonth = today.getMonth() + 1;
    var todayDate = today.getDate();
function gray(){
 $('body').css({
     "-webkit-filter":"grayscale(100%)",
     "-moz-filter":"grayscale(100%)",
     "-ms-filter":"grayscale(100%)",
     "-o-filter":"grayscale(100%)",
     "filter":"progid:DXImageTransform.Microsoft.BasicImage(grayscale=1)",
     "_filter":"none"});
}
    if (todayMonth == 4 && todayDate == 4) {gray()} // 4 月 4 日
    if (todayMonth == 6 && todayDate == 4) {gray()}
    if (todayMonth == 12 && todayDate == 13) {gray()} // 12 月 13 日
})
</script>

方法二

用 grayscale.js，一句引用 + 一句调用就 ok 了，

但是 grayscale.js 在 Safari4 以下和 Chrome 中不支持对图片进行灰度处理！

<script src="https://j11y.io/demos/grayscale/grayscale.js"></script>
// 原生js
grayscale(document.getElementById("gray"));
// jq
grayscale($("body"));

定时后

<script src="https://j11y.io/demos/grayscale/grayscale.js"></script>
<script>
$(document).ready(function() {
    var today = new Date();
    var todayMonth = today.getMonth() + 1;
    var todayDate = today.getDate();
 
    if (todayMonth == 4 && todayDate == 4) {grayscale($("body"));} // 对 body 执行
    if (todayMonth == 6 && todayDate == 4) {grayscale($("#gray"));} // 可指定 id class 或单一元素 em div ..
    if (todayMonth == 12 && todayDate == 13) {grayscale()} // 简写，全局
})
</script>