当别人受到伤害的时候，我们所能做的就是冷静理智的去做自己力所能及的事情。
今天临时接到通知，说天津爆炸，网站尽量保持灰黑色调，而且今天中午之前完成。so,本以为会很麻烦的事情，而且以前也没有做过在网上找了一下方案，发现并不是想象中的那么难。
其实只需要在外部html加上一个滤镜效果即可。
|
1 2 3 4 5 6 7 8 9 |
html { -webkit-filter: grayscale(100%); -moz-filter: grayscale(100%); -ms-filter: grayscale(100%); -o-filter: grayscale(100%); filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1); _filter:none; 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"); } |
上面代码加了兼容的，亲测在ie789 chrome,ff可行，但是ie10不行不知道为什么。
现在仍然找不到原因。
最后一个利用svg的其实是用来兼容火狐的。
很简单的一个效果，然而”万能的PM”变成灰色之后导航不好看，要让颜色做一下更改。
好，我改。
就是把颜色改一下不就完，然而不支持的ie10,11怎么办呢？
我做过ie css hack 但是没有做过专门高版本的hack呀。
查了一下，\9 是专门ie10,9,8,7的hack方式，但是不支持11呀，最后再万能的爆栈上找到了一个方法：
|
1 2 3 |
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { /* IE10+ specific styles go here */ } |
ok,解决了。
ps: 当时说要做这个效果的时候我还在想，是不是要重新写一套css呀，像更换主题一样，更换css。当时另一个产品线的pm,说了句以前没做过滤镜，我当时看到这句都没反应过来，现在回想，PM真的是万能的。