倒计时切换网页为灰色或恢复正常网页

久伴

643
文章

535
评论

2020年4月4日16:17:16 评论 213 1750字阅读5分50秒

倒计时切换网页为灰色代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>倒计时</title>
    <style>

    </style>
</head>
<body>
    <div>
        <img src="https://jiubx.com/wp-content/uploads/2020/04/2020040304530377.png" alt="">
    </div>
    <span id="jtime"></span>
</body>
<script>
    function j_time() {
        var jtime = new Date();
        var stoptime= new Date("2020/4/4 16:11:00");//结束时间
        var shenyu=(stoptime.getTime()-jtime.getTime())/1000;
        var oDay = parseInt(shenyu/(24*60*60));
        var oHours  = parseInt(shenyu/(60*60));
        var oMinutes = parseInt((shenyu/60)%60);
        var oSeconds  = parseInt(shenyu%60);
        // console.log(shenyu,oDay,oHours,oMinutes,oSeconds);
        var jspan=document.getElementById("jtime");
        jspan.innerText=oDay+'天'+oHours+'小时'+oMinutes+'分钟'+oSeconds+'秒';
        if(shenyu<0){
            j_html();
            clearInterval(b);
            jspan.innerText="";
        }
    }
    function j_html() {
            var a = document.body.style.filter="grayscale(100%)";
            console.log(a);
    }
 var b=setInterval(j_time,1000);

    j_time();
</script>
</html>

倒计时切换网页为正常颜色代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>倒计时</title>
    <style>

    </style>
</head>
<body>
    <div>
        <img src="https://jiubx.com/wp-content/uploads/2020/04/2020040304530377.png" alt="">
    </div>
    <span id="jtime"></span>
</body>
<script>
    function j_time() {
        var jtime = new Date();
        var stoptime= new Date("2020/4/4 16:11:00");//结束时间
        var shenyu=(stoptime.getTime()-jtime.getTime())/1000;
        var oDay = parseInt(shenyu/(24*60*60));
        var oHours  = parseInt(shenyu/(60*60));
        var oMinutes = parseInt((shenyu/60)%60);
        var oSeconds  = parseInt(shenyu%60);
        // console.log(shenyu,oDay,oHours,oMinutes,oSeconds);
        var jspan=document.getElementById("jtime");
        jspan.innerText=oDay+'天'+oHours+'小时'+oMinutes+'分钟'+oSeconds+'秒';
        if(shenyu<0){
            j_html();
            clearInterval(b);
            jspan.innerText="";
        }
    }
    function j_html() {
            var a = document.body.style.filter="grayscale(0%)";
            console.log(a);
    }
 var b=setInterval(j_time,1000);

    j_time();
</script>
</html>

继续阅读