利用js设置指定日期/时间使html页面css样式自动变成灰色
新建isgray.js,写入以下代码:
document.write([
'<style type="text/css">',
' .htmlgray-filter {',
' filter: grayscale(100%);',
' -webkit-filter: grayscale(100%);',
' -moz-filter: grayscale(100%);',
' -ms-filter: grayscale(100%);',
' -o-filter: grayscale(100%);',
' filter: url("data:image/svg+xml;utf8,#grayscale");',
' filter: progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);',
' -webkit-filter: grayscale(1);',
' }',
'</style>'].join('')
);
var date = new Date();
var nowMonth = date.getMonth() + 1;
var nowDay = date.getDate();
var nowDate = nowMonth + '-' + nowDay;
var nationalMemorialDayArray = ['4-4', '5-12', '12-13'];
if (nationalMemorialDayArray.includes(nowDate) && location.pathname=='/') {
var root = document.documentElement;
root.className += ' htmlgray-filter';
}
解释:在每年的4月4日、5月12、12月13号这三个日期,将页面的css设置成htmlgray-filter
然后在需要变灰的html代码里调用js即可。
<script src="/skin/daheweb/js/isgray.js"></script>