在国家公祭日自动将网站变灰
前言
cdn刷新有延迟,所以我想写个能自动在当日切换的样式
网络上搜到不能满足我的需求,所以自己写了个
使用方法
将以下代码放入html文件的head
标签内即可在国家公祭日(12月13日)自动将页面变灰
代码解释
javascript部分是在每天12月31日给html
标签加上theme-mode
属性并且赋值为'gary'
css样式是把theme-mode
属性为'gary'
的html
标签变灰
代码
<script type="text/javascript">
var date = new Date()
var month = date.getMonth() + 1
var day = date.getDate()
if (month == 12 && day == 13) {
document.documentElement.setAttribute("theme-mode", "gray");
}
</script>
<style type="text/css">
html[theme-mode="gray"] {
/*webkit*/
-webkit-filter: grayscale(100%);
/*firefox*/
-moz-filter: grayscale(100%);
/*ie9*/
-ms-filter: grayscale(100%);
/*opera*/
-o-filter: grayscale(100%);
/*ie*/
filter: grayscale(100%);
filter: progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);
}
</style>
注意事项
如果你的html
标签中刚好有theme-mode
属性,请将代码中出现的两处theme-mode
换成其他的词