今天是5.12是個特殊的日子,有的時候吧 會把整個網(wǎng)站變灰的需求
這個我們用css過濾器 一行代碼就能實現(xiàn)了

filter: grayscale(100%);

問題是 出在定點觸發(fā) 這塊,我們可以通過js 來實現(xiàn)
核心就是時間的判斷這塊

比如: 我們要在5.12凌晨十二點觸發(fā) 到 5.13的凌晨關(guān)閉
就可以這樣寫

// 原生js 在三大框架中 都可以直接拿過去使用

let nowTime = new Date().getTime(),overTime = new Date("2022/05/12 00:00:00").getTime(),endTime = new Date("2022/05/13 00:00:00").getTime();if (nowTime > overTime && nowTime < endTime) {document.documentElement.style.cssText ="filter: grayscale(100%);";}

這里就不考慮什么樣式的兼容性了 畢竟css3 現(xiàn)在移動端瀏覽器支持的都不錯

然后就可以實現(xiàn)了 網(wǎng)站定點變灰和恢復(fù)了。省的運維人員半夜起來發(fā)包了

關(guān)注我 持續(xù)更新 前端知識

總結(jié)

以上是生活随笔為你收集整理的一行css代码让整个网站变灰, 通过js控制定点触发和关闭的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。