今天是5.12是个特殊的日子,有的时候吧 会把整个网站变灰的需求
这个我们用css过滤器 一行代码就能实现了
filter: grayscale(100%);
问题是 出在定点触发 这块,我们可以通过js 来实现
核心就是时间的判断这块
比如: 我们要在5.12凌晨十二点触发 到 5.13的凌晨关闭
就可以这样写
// 原生js 在三大框架中 都可以直接拿过去使用
let nowTime = new Date().getTime(),overTime = new Date("/05/12 00:00:00").getTime(),endTime = new Date("/05/13 00:00:00").getTime();if (nowTime > overTime && nowTime < endTime) {document.documentElement.style.cssText ="filter: grayscale(100%);";}
这里就不考虑什么样式的兼容性了 毕竟css3 现在移动端浏览器支持的都不错
然后就可以实现了 网站定点变灰和恢复了。省的运维人员半夜起来发包了
关注我 持续更新 前端知识
