网站变灰,代码收集

各种网站变灰代码收集:

一、CSS代码

<style>
    html {
        -webkit-filter: grayscale(100%);
        -moz-filter: grayscale(100%);
        -ms-filter: grayscale(100%);
        -o-filter: grayscale(100%);
        filter:progid:lolXImageTransform.Microsoft.BasicImage(grayscale=1);  
        _filter:none;
    }
</style>

还可以加入特定时期判断:

<script>
  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)){
    var root = document.documentElement;
    root.className += ' htmlgray-filter';
  }
</script>

二、另一种CSS代码

html {
	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,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale");
	filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);
	-webkit-filter: grayscale(1);
}

或者直接引入

<link type="text/css" rel="stylesheet" href="https://cdn.jsdelivr.net/gh/malaohu/jscdn/grey.css"/>

三、放JS里:

document.getElementsByTagName('body')[0].style.filter = 'grayscale(100%)';
© 版权声明
THE END
点赞0赞赏 分享
评论 抢沙发
头像
欢迎您留下宝贵的见解!
提交
头像

昵称

取消
昵称表情代码图片

    暂无评论内容